Javascript 页面刷新后如何从选择器获取状态？

我在react JS样板代码中有一个容器组件，它使用sagas将数据（比如学校列表）获取到reducer中，并在我的呈现页面中设置选择器函数读取的状态以显示给用户

从服务器返回的saga.js示例数据

actions.js代码段

reducer.js代码段

selector.js代码段

index.js代码段

//这将触发action请求\u SCHOOLS in action.js
建造师（道具）{
超级（道具）；
this.props.requestSchools（）；
}
render（）{
const{schools}=this.props；
const renderSch=schools.data.map（sch=>(
{sch.name}{sch.location}
));
返回(
{renderSch}
);
}
const mapStateToProps=createStructuredSelector({
schoolsContainer:makeSelectSchoolsContainer（），
学校：makeSelectSchools（），
});
功能图DispatchToprops（调度）{
返回{
//派遣请求学校行动
请求学校：（）=>调度（请求学校（）），
};
}

---

在构建web包的第一个实例中，我能够获得数据，并且能够正确地进行渲染。但是，当我刷新同一页时，数据会一直到reducer（状态设置的地方）而不是选择器（状态设置的地方）。如何在页面刷新后将数据从reducer获取到选择器中？

首先，尽量不要使用componentWillMount方法，因为React（）不推荐使用该方法

我不明白为什么它对刷新不起作用。您可能不需要将选择器作为一个函数，也可能需要一个默认值来确保您在React中执行的映射的有效性（可能这就是问题所在？）

然后在容器中调用它：

const mapStateToProps = createStructuredSelector({ schools: makeSelectSchools });

您确定控制台中没有更多日志吗？还是在redux开发工具中？调试起来相当困难，我个人也不认为你的应用程序只有在第一次加载时才能工作（如果你不管理任何缓存的话）

---

希望这些反馈能帮助您缩小问题范围：）

谢谢您的反馈，我现在不使用componentWillMount方法。但是，设置默认值并不能解决问题。在redux工具中，当我（手动）刷新页面时，在第一个实例（构建）中调用的所有操作（其中所有内容都被呈现）也会被调用。根据我的理解，问题在于selectors.js。页面重新加载后，它不会从reducer获取状态。然而，减速器处于设置状态，我可以记录它。从选择器获取状态时，数据未定义。我已设法解决问题。原因是，最初，我在saga.js中使用了一组数据，而没有对api服务器执行fetch请求调用。更改后，每次页面刷新时都会呈现数据，并且工作正常。

    export function requestSchools() {
      return {
        type: REQUEST_SCHOOLS,
      };
    }
    export function requestSchoolsSucceeded(schoolsData) {
      return {
        type: REQUEST_SCHOOLS_SUCCEEDED,
        schoolsData,
      };
    }

    function schoolsContainerReducer(state = initialState, action) 
    {
      switch (action.type) {
        case REQUEST_SCHOOLS_SUCCEEDED:
           return state.set('schools', action.schoolsData);
        default:
           return state;
      }
    }

    const makeSelectSchools = () =>
     createSelector(selectSchoolsContainerDomain, schoolState =>
     schoolState.get('schools'),
    );

    //This will trigger action REQUEST_SCHOOLS in action.js
    constructor(props) {
        super(props);
        this.props.requestSchools();
    }

    render() {
        const { schools } = this.props;

        const renderSch = schools.data.map(sch => (
          <div key={sch.id}>
            {sch.name} {sch.location}
          </div>
        ));
        return (
          <div>
            {renderSch}
          </div>
        );
      }

    const mapStateToProps = createStructuredSelector({
      schoolsContainer: makeSelectSchoolsContainer(),
      schools: makeSelectSchools(),
    });

    function mapDispatchToProps(dispatch) {
      return {
        //dispatch request schools action
        requestSchools: () => dispatch(requestSchools()),
      };
    }

const makeSelectSchools = createSelector(
  selectSchoolsContainerDomain, // What is this doing? Getting the state of the previous reducer right?
  schoolState => schoolState.get('schools') || [],
);

const mapStateToProps = createStructuredSelector({ schools: makeSelectSchools });