Day 21 单向资料流

第 21 天 !

我们来了解 react 的 资料流(data flow)，

在我们之前做的To Do List范例来说，

在设定资料的时候，

只单纯在 App component 设定了 state，

其他几个地方，都是依靠 App component 的 state 在建立的，

所以我们可以说，

以 App component 的 state 为起点，向下用 props 传递，

这样一层一层往下传递。

那假如我们需要改变资料，透过往下传递改变资料的 function，

来让来源资料改变，再次向下传递

这种就叫做 单向资料流(one way data flow)

like:

const ChildA = ({text})=>{
  return <Text>{text}</Text>
};

class App extends React.Component {
  constructor(props){
    this.state = {
      text: '123'
    }
  }

  render(){
    return (
      <ChildA text={this.state.text}/>
    );
  }
};

因为来源只有一个，所以当我们发生问题时，会依照来源向上追踪

甚至是改变资料的实际操作，也只会在来源处，

所以比较容易的去追踪问题