将React flux与redux结合

Question

在下面的一个项目中加入（交互）Redux与flux是否是一个很好的解决方案？ 状态（inputText）位于我们的组件（TOdoInput）中，不在应存储在Redux中的状态。在Redux中拥有本地状态是否正确？

class TodoInput extends Component { 

    constructor(props, context) { 
    super(props, context) 
    this.state = { 
     inputText: '' 
    } 
    } 

    handleChange(event) { 
    this.setState({ 
     inputText: event.target.value 
    }) 
    } 

    handleSubmit(event) { 
    event.preventDefault() 
    this.props.addTodo(this.state.inputText) 
    } 

    render() { 
    return (
     <div> 
     <form onSubmit={this.handleSubmit.bind(this)}> 
      <input 
      type="text" 
      placeholder="Type in your todo" 
      value={this.state.inputText} 
      onChange={this.handleChange.bind(this)} 
      /> 
      <input type="submit" value="Submit"/> 
     </form> 
     </div> 
    ) 
    } 

Answer 1

是的，它是正确的。

本地（组件状态）与全局状态（还原器）是一个值得关注的问题。

例如采取其显示用户信息

• 甲标签栏应该知道哪个标签是有活性的标签栏的组成部分。没有其他组件在意，所以它可能是用this.state处理的本地组件状态。
• 另一方面，该选项卡的用户信息是全球关注的问题。事实上，很多你的组件应用程序应该有兴趣显示名称，年龄等。所以这个状态应该存储在一个reducer中。

您的TodoInput的主要作用是准备要发送给reducer的文本。所以输入值在用户输入时才是重要的。

• 可以格式化文本
• 你可以要求服务是有一个错字
• ...

一旦确认文本是与你的关心OK应用程序，你验证它。在这一步，你的关注值更改。现在它可以被其他组件消耗的价值。所以它必须存储在全球商店（redux reducer）中。