时间戳

首页 > 解决方案 > 使用本地状态作为输入值和 redux 存储

reactjs - 使用本地状态作为输入值和 redux 存储

问题描述

我开始学习 redux，我有以下问题。所以我有一个具有初始状态的 redux 存储，并且我还有一个负责（调度操作）用户输入数据的组件。因此，如果输入是受控的，我应该在 redux 存储（initialState）中设置它们的 value 属性并在每次 value 更改时调度一个动作，还是应该使用组件的本地状态 -

 class Calc ...
   constructor(props){
       super(props);
       this.handleChange = this.handleChange.bind(this);
       this.state = {
           inputVal: ''
       }
   }

   handleChange(e){
      this.setState({
         [e.target.name]: e.target.value
      })
   }

   render(){
     return(
          <div>
              <input type="text" name="inputVal" value={this.state.inputVal} onChange={this.handleChange} />
          </div>
     )
   }

标签： reactjsreduxstate

解决方案

在我看来，在你在 redux store 中存储东西之前，你应该问自己一些问题：

  • 如果我的状态“inputVal”将在其他组件之间共享？
  • 如果我的“inputVal”的变化对其他组件有一些影响

如果您得到绝​​对答案“是”，则可能需要将此状态“inputVal”存储在 redux 状态中。

如果否，则不需要将此状态存储在 redux 中。取而代之的是，只需处理组件“Cal”中的状态

推荐阅读