react-redux

问题 I'm trying to map data using below json format. An object having list of objects. '''{"pki_user_id":1234,"vc_username":null,"vc_password":null,"vc_name":"Muhammad","vc_email":"Muhammad.Bilal@gmail.com","b_isreset":false,"b_timeout":0,"_RoleDto":[{"pki_role_id":30019,"vc_rolename":"SuperUser","vc_roledesc":"Super User","vc_type":null,"i_group":0,"_MenuDto":null},{"pki_role_id":20015,"vc_rolename":"COMADM","vc_roledesc":"Competency Admin","vc_type":null,"i_group":0,"_MenuDto":null},{"pki_role

问题 Update to the original post: I have realized that the issue is that the updates in the Redux state (props to the WaitingRoom component) somehow set the entire state of the component to its initial state. Thus, "showmatchingwindow" was set to false as well. Initially, after MATCHING_REQUEST was dispatched and "loading" was set to true, the state of WaitingRoom component still remained unchanged. However, after MATCHING_SUCCESS was dispatched and "loading" turned false and "buddy" and "chatid"

问题 import { logout } from '../../actions/user.actions'; const Logout = () => { useEffect(() => { Router.push('/any'); }, []); }; Test File afterEach(() => { jest.clearAllMocks(); }); afterAll(() => { jest.resetAllMocks(); // clear all the mocks. }); it('Should check the route', () => { const wrapper = mount(<Logout />); expect(wrapper.find('LoadingMessage')).toBeTruthy(); expect(useDispatch).toBeCalledTimes(1); const mDispatch = useDispatch(); expect(mDispatch).toBeCalledWith({ type: 'USER

问题 I have one component as below. I am calling on api on its componentDidMount() event. I am not getting why am I not getting its prop value first time when component renders. Also I am not sure why component is rendering 2 times. I have below code. import React, { Component } from "react"; import { connect } from "react-redux"; import { Link } from "react-router-dom"; import AgmtTable from "./AgmtTable"; import * as AgmtAction from "../redux/actions/AgmtAction"; class AgmtContainer extends

问题 Description of problem: Changing the id (numbers only) of this url via the link tag does not update the page (but does change the url in the adress bar). Hitting refresh afterward will show the updated page. http://localhost:8080/video/id/7564 Right clicking to open the link in a new tab, or changing the link path to a completely different page works as expected. My app.js file import React from 'react' import { Router, Route, Switch } from 'react-router-dom' import RenderHomepage from '..

问题 I am getting this error message when i used a redux-form into my simple three input fields form. form.jsx import React, {Component} from 'react'; import { Field, reduxForm } from 'redux-form' import { connect } from 'react-redux'; class Signup extends Component { signupView = () => { return ( <section id="user_login"> <form onSubmit={this.handleSignup}> <ul> <li> <div className="custom_group"> <Field type="text" className="trans login_input" title="Username" name="username" placeholder=

问题 Everything works fine, but i have this warning Expected to return a value at the end of arrow function array-callback-return , i try use forEach instead map , but then <CommentItem /> doesn't even show. How fix it? return this.props.comments.map((comment) => { if (comment.hasComments === true) { return ( <div key={comment.id}> <CommentItem className="MainComment"/> {this.props.comments.map(commentReply => { if (commentReply.replyTo === comment.id) { return ( <CommentItem className="SubComment

问题 I'm studying how Hooks APIs provided by React-Redux-v.7.1 works, and saw it mentioned in Equality Comparisons and Updates (https://react-redux.js.org/api/hooks#equality-comparisons-and-updates) that: " As of v7.1.0-alpha.5, the default comparison is a strict === reference comparison. This is different than connect() , which uses shallow equality checks on the results of mapState calls to determine if re-rendering is needed. This has several implications on how you should use useSelector() . "

问题 I am trying to understand the useEffect hook in-depth. I would like to know when to use which method and why? 1.useEffect with no second paraments useEffect(()=>{}) 2.useEffect with second paraments as [] useEffect(()=>{},[]) 3.useEffect with some arguments passed in the second parameter useEffect(()=>{},[arg]) 回答1: useEffect(callback) Runs on every component render. Typically used for debugging, analogous to function's body execution on every render: const Component = () => { callback()

问题 I am stuck in setting the server-side validation of the redux form. I have a registration form and performing a client-side validation perfectly, but while in server-side validation I am unable to understand how to display the error message from the server with a respective input field. API request const createMemberRegistration = user => { return dispatch => { dispatch({ type: POST_REQUEST }); processMemberRegistration(user) .then(user => { dispatch({ type: REGISTRATION_SUCCESS }); dispatch