redux

问题 I have the following test: describe('Form', () => { let store; let wrapper; beforeEach(() => { store = mockStore(mockData); wrapper = mount( <Provider store={store}> <Form /> </Provider> ); }); it('handleForm calls uses validate() for validation', () => { const instance = wrapper.instance(); const submitFormButton = wrapper.find('.submitFormButton'); submitFormButton.simulate('click'); console.log(instance); // null }); }); Any idea of what I'm doing wrong exactly? I know that Enzyme has this

问题 I'm building a quick authentication higher order component in Next.js and am getting some problems with the following code: import SignIn from "../components/sign-in"; import { connect } from "react-redux"; import { useRouter } from "next/router"; const AuthenticationCheck = WrappedComponent => { const { isAuthenticated, ...rest } = props; const router = useRouter(); const protectedPages = ["/colours", "/components"]; const pageProtected = protectedPages.includes(router.pathname); return

问题 I have a function (a Redux action) which calls 2 functions. I can't figure how how to test this with Jest: This is my function: import doSomething from 'redux/do-something'; import doSomethingElse from 'redux/do-something-else'; export default () => async dispatch => { await dispatch(doSomething()); dispatch(doSomethingElse()); }; This is my test: import doSomething from 'redux/do-something'; import doSomethingElse from 'redux/do-something-else'; import functionToTest from 'redux/function-to

问题 I'm trying to map an array of objects but it keeps saying that docs are undefined even though I can clearly see it in console.log This is what I get when I console.log {console.log(this.props.results.data)} what I want is in the docs field. If I expand it looks like this Since I want to print out the content of docs this is what I tried doing <div className='list-render'> {this.props.results.loading ? <LoadingSpinner/> : <div className='row'> {(this.props.results.data.docs.map((data) => { //

问题 I see that with Redux there's two ways of passing down the state to the components in a React app, one is throw the Provider component and the other one with the connect functionality. However, I wonder why there's two different ways and which one is better in performance than the other. 回答1: They are not mutually exclusive. Actually you will almost always need to use Provider , even with connect (See: https://github.com/reactjs/react-redux/blob/master/docs/api.md#provider-store) Without

问题 In a react-native application, I call an action sends data to firebase. but after the call, I get an error whose source seems to be with the way the snapshot listener is working. the add-msg action more or less looks like this: create data: const addMsg = (msg, convoIds) => { console.log('Firestore Write: (actions/conversation) => addMsg()'); return firebase.firestore().collection('messages').add({ time: firebase.firestore.FieldValue.serverTimestamp(), sender: msg.sender, receiverToken: msg

问题 I've just started to learn and use redux-saga, at first I thought it worked this way: first you make action which is connected to saga, then saga detects action,calls api which returns data and saga returns this data to reducer. I built 2 testing saga files and one root saga (I wanted to make rootSaga, like combineReducer), so this is my rootSaga : import * as SpreadsheetSagas from "../pages/spreadsheet/containers/spreadsheet/spreadsheet.saga"; import * as SpreadsheetFilterSagas from "..

问题 So basically I got this socket, that is working correctly sending me 'new order' message. I'm using redux, and i want to dispatch an action, than a reducer would get it and my store would be updated. but this code doesn't do anything! socket.on('new order', (order) => { return (dispatch) => { dispatch(socketNewOrder(order)); } }); And here is my action, which is located at the same file: export const socketNewOrder = (order) => { return { type: 'SOCKET_NEW_ORDER', payload: order } } I also

问题 I was learning React and Redux and while doing that I decided to make webpage with a button which on clicking would change the state. Below the button I wanted to display the current state in a different component. Though the button on clicking changes the state, but it is not getting reflected in the component. Here is my code: App.js import React from 'react' import Name from './Name' import {changeName} from './Action'; export default function App () { return ( <div> <button onClick=

问题 I was learning React and Redux and while doing that I decided to make webpage with a button which on clicking would change the state. Below the button I wanted to display the current state in a different component. Though the button on clicking changes the state, but it is not getting reflected in the component. Here is my code: App.js import React from 'react' import Name from './Name' import {changeName} from './Action'; export default function App () { return ( <div> <button onClick=