javascript - 如何从 redux store 获取状态的最新值?

标签 javascript reactjs redux react-redux

我对 Redux 还很陌生,我正在使用 react-redux包并尝试实现一个简单的功能(尽管我知道这可以通过本地状态处理),您在输入中键入的任何内容都应显示在 <p></p> 之间。标签。

下面是代码:

Edit 73zq1yl2r1

我对第 62 行有点怀疑,即我访问最新状态并打印出来的方式,这是正确的方式吗?

最佳答案

顺便说一句,好的开始。我认为你把州部分搞得有点复杂了。我为你修改了它,还删除了 bind 关键字,如果你使用最新的 JS lang 规范,我觉得不需要它。

我使用Object.assign只是为了防止状态对象突变。通常可以通过使用 ImmutableJS 来避免这种情况。 (请阅读文档)

// Reducer.
const updateReducer = (state = {text:''}, action) => {
  switch (action.type) {
    case UPDATE_TEXT:
      return Object.assign({}, state, { text: action.text });
    default:
      return state;
  }
};

const mapStateToProps = state => {
  return {
    text: state.text
  };
};

渲染方法:

 render() {
    return (
      <div>
        <input type="text" onChange={(...arg) => this.changeText(...arg)} />
        <p>{this.props.text}</p>
      </div>
    );
  }

您的初始代码有什么问题?

您将每个击键的所有文本以及更新和增长的文本存储在一个数组中。在渲染时仅显示最后一个(在数组中创建了从未使用过的不需要的副本)并省略其他数组值。相反,只需用当前传入值替换旧值即可。

您的 fork 代码 here

编码愉快!

关于javascript - 如何从 redux store 获取状态的最新值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52933570/

相关文章:

javascript - 谷歌标签管理器给出混合内容错误

javascript - 通过 facebook id 获取登录用户的可标记 id

javascript - 如何将文本添加为​​ jqplot canvasOverlay?

reactjs - 更新状态的多个部分的 Reducer

javascript - CoSTLy 不可变操作

reactjs - 使用 Connect 或将数据作为 Prop 传递给 child

javascript - 如何在 D3 中访问 JSON 时添加授权 header

javascript - 如何在 react 中使用gapi

reactjs - 无法在呈现 nextjs apollo 应用程序的服务器中的组件中获取更新的缓存

javascript - 必须包裹在封闭标签中