redux

问题 Seen several questions about this but with many unclear and different answers. I am rendering a list of items in the very first load of my component, and currently I'm triggering this fetch like so: fetchMovies = () => { console.log('component page:', this.props.movie.page); this.props.getMoviesIfNeeded(this.props.movie.page); }; handleScroll = throttle(() => { let d = document.body; let scrollTop = window.scrollY; let windowHeight = window.innerHeight || document.documentElement.clientHeight

问题 Seen several questions about this but with many unclear and different answers. I am rendering a list of items in the very first load of my component, and currently I'm triggering this fetch like so: fetchMovies = () => { console.log('component page:', this.props.movie.page); this.props.getMoviesIfNeeded(this.props.movie.page); }; handleScroll = throttle(() => { let d = document.body; let scrollTop = window.scrollY; let windowHeight = window.innerHeight || document.documentElement.clientHeight

问题 My basic static React Redux TypeScript app works locally on Windows, and then it also works when I deploy to GitHub Pages for every device I've tested except iPhone 6 iOS 12.0.1 (where it is a blank white screen). I've researched many articles, such as: React/redux app renders blank screen on Safari React/Node Uncaught SyntaxError: Unexpected token < Why deployed react app on gh-pages is showing blank page on different browsers while showing correctly on my browser? https://stackoverflow.com

问题 My code class LoginPage extends Component { render() { return ( <div> <TextInput/> <br/> <TextInput/> <br/> <Button onClick={() => { const dispatcher = useDispatch(); dispatcher(singIn()) }}>SING IN</Button> </div> ); } } I guess that I am using a hooks in a class component, but what can I use instead of useDispacth to my LoginPage? 回答1: For class components, you need to use connect method from react-redux . Use connect method and pass mapDispatchToProps function as shown below. import {

问题 Issue (tl;dr) How can we create a custom redux-orm reducer with redux-toolkit's createSlice? Is there a simpler, recommended, more elegant or just other solution than the attempt provided in this question? Details The example of a custom redux-orm reducer looks as follows (simplified): function ormReducer(dbState, action) { const session = orm.session(dbState); const { Book } = session; switch (action.type) { case 'CREATE_BOOK': Book.create(action.payload); break; case 'REMOVE_AUTHOR_FROM

问题 I want to add a React component (called ApplicationForm ) to a storybook. The story book is written this way: import { configureStore } from '../store'; const store = configureStore(); storiesOf('application from', module) .addDecorator(story => <Provider store={store}>{story()} </Provider>) .add('all', () => ( <ApplicationForm /> )); The ApplicationForm is created with reduxForm. That's why I need to provide a store in the addDecorator function. Unfortunately in the configureStore function,

问题 I want to add a React component (called ApplicationForm ) to a storybook. The story book is written this way: import { configureStore } from '../store'; const store = configureStore(); storiesOf('application from', module) .addDecorator(story => <Provider store={store}>{story()} </Provider>) .add('all', () => ( <ApplicationForm /> )); The ApplicationForm is created with reduxForm. That's why I need to provide a store in the addDecorator function. Unfortunately in the configureStore function,

问题 action.ts: export const fetchField = (dispatch) => { console.log("!!!") const Form = new Service(); Form .getProduct() .then((spec: Spec) => { dispatch({ type: ACTIONS.SPEC.SHOW, spec : specification, }); }) .catch((err) => {}); }; appReducer: export interface FormsState { products: Array<Specification> } let initialState: FormsState = { products: [] }; export let appReducer = ( state: FormsState = initialState, action ) => { switch (action.type) { case ACTIONS.SPEC.SHOW: return Object.assign

问题 action.ts: export const fetchField = (dispatch) => { console.log("!!!") const Form = new Service(); Form .getProduct() .then((spec: Spec) => { dispatch({ type: ACTIONS.SPEC.SHOW, spec : specification, }); }) .catch((err) => {}); }; appReducer: export interface FormsState { products: Array<Specification> } let initialState: FormsState = { products: [] }; export let appReducer = ( state: FormsState = initialState, action ) => { switch (action.type) { case ACTIONS.SPEC.SHOW: return Object.assign

问题 action.ts: export const fetchField = (dispatch) => { console.log("!!!") const Form = new Service(); Form .getProduct() .then((spec: Spec) => { dispatch({ type: ACTIONS.SPEC.SHOW, spec : specification, }); }) .catch((err) => {}); }; appReducer: export interface FormsState { products: Array<Specification> } let initialState: FormsState = { products: [] }; export let appReducer = ( state: FormsState = initialState, action ) => { switch (action.type) { case ACTIONS.SPEC.SHOW: return Object.assign