【问题标题】：Redux mapStateToProps does not workRedux mapStateToProps 不起作用
【发布时间】：2019-01-31 01:02:43
【问题描述】：

当组件通过 Redux 操作更改时，ques 似乎已输入并且提醒已更改。但是，如果从另一个组件导入mapStateToProps，则该值不会更改，并且只会输入空值。为什么？ This is my github

组件/投票

import { combineReducers } from 'redux';
import { INFOMATION } from "../actions";

const postInitialState ={
    id: '',
    ques: '',
    ans1: '',
    ans2: ''
};


const postInfomation = (state = postInitialState, action) => {
switch (action.type) {
    case INFOMATION:
        console.log(state)
        return Object.assign({}, state, {
            id: action.id,
            ques: action.ques,
            ans1: action.ans1,
            ans2: action.ans2
        });
    default:
        return state
    }
};



const postApp = combineReducers({
    postInfomation
});

export default postApp;

reducer/投票

import React, {Component, Fragment} from 'react';
import { connect } from 'react-redux';

class Vote extends Component {
    render() {
        return (
            <Fragment>
                <h1>qwe</h1>
                <h1>{this.props.id}</h1>
                <h1>{this.props.ques}</h1>
            </Fragment>
        )
    }
}

let mapStateToProps = (state) => {
    console.log(state)
    return {
        id: state.postInfomation.id,
        ques: state.postInfomation.ques,
        ans1: state.postInfomation.ans1,
        ans2: state.postInfomation.ans2
    };
}

Vote = connect(mapStateToProps) (Vote);

export default Vote;

【问题讨论】：

“值不变，只输入空值”是什么意思？此外，您在代码的某些部分使用 qus 而不是 ques，这可能会导致问题。
进入 github 可以看到，没有错别字的错误。当你作用于A组件，reducer改变了ques值，你在B组件中通过mapStateToProps导入值时，它不会改变。

标签： reactjs redux jsx

【解决方案1】：

您的代码正在运行，但是通过访问 /vote 页面，您的应用会重新加载并且状态会重新初始化。您可以通过Redux Devtools extension 发现这一点，它会在导航时显示@@INIT 调用。

如果您添加 <Link to="/vote">Vote</Link> 以导航到 /vote 路由，您会注意到状态仍然存在。如果您使用HashRouter，则不会出现此问题，因为浏览器不会重新加载页面。

请注意，您的状态逻辑存在更多问题。每次用户更新您的输入字段之一时，您都会更新 redux 存储和本地状态。但是当用户随后提交表单时，您只更新本地状态的 id，如果用户再次更改其中一个输入字段，该 id 只会置于 redux 状态。

我只会在提交表单后更新 redux 状态。在此之前将值保持在本地状态。还将您的 axios 调用移动到您通过 redux-thunk 的操作调用的服务。

【讨论】：