javascript - 在react中使用redux无法更新的问题

问题描述

问 题

这是入口文件

import React from 'react';
import ReactDOM from 'react-dom';
import Index from 'components/Index';
import { createStore } from 'redux';
import { Provider } from 'react-redux';
import countNumber from 'components/reducer';
import data from 'components/store';

//初始化store
let store = createStore(countNumber, data);

store.subscribe(() => {
    console.log(store.getState());
});

ReactDOM.render(
    <Provider store={store}>
        <Index />
    </Provider>,
    document.getElementById('fao')
);

这是我的react组件

import React from 'react';
import ReactDOM from 'react-dom';
import { connect } from 'react-redux';
import { AddNumber, MinusNumber, InitializeNumber } from 'components/actions';
import CountNumber from 'components/Index/countNumber';

class Index extends React.Component {
    constructor(props) {
        super(props);
    }

    render() {
        const { number, addNumber, minusNumber } = this.props;

        return (
            <div>
                <CountNumber
                    add={() => addNumber()}
                    minus={() => minusNumber()}
                    value={number}/>
            </div>
        );
    }
}

function select(store) {
    return {
        number: store.changeNumber.number
    }
}

function mapDispatchToProps(dispatch) {
    return {
        addNumber: () => dispatch(AddNumber()),
        minusNumber: () => dispatch(MinusNumber())
    }
}

export default connect(select, mapDispatchToProps)(Index);

我想要更新this.props.number的值，但却失败了，它的值一直都是0，我不知道哪里出错了，希望大神求教

这是我的github

解决方案

已经解决，在reducer中需要使用Object.assign()返回一个新的对象出来才能更新state

这篇关于javascript - 在react中使用redux无法更新的问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！