单向数据流

​x
function Counter() {
  // State: counter 值
  const [counter, setCounter] = useState(0)

  // Action: 当事件发生后，触发状态更新的代码
  const increment = () => {
    setCounter(counter + 1)
  }

  // View: 视图定义
  return (
    <div>
      结果: {counter} <button onClick={increment}>增加</button>
    </div>
  )
}

这个组件包含以下部分：

• state：驱动应用的真实数据源头
• view：基于当前状态的视图声明性描述
• actions：根据用户输入在应用程序中发生的事件，并触发状态更新

单向数据流：

• 用 state 来描述应用程序在特定时间点的状况

• 基于 state 来渲染出 View

• 当发生某些事情时（例如用户单击按钮），state 会根据发生的事情进行更新，生成新的 state

• 基于新的 state 重新渲染 View

  

实时效果反馈

1. ___来确定如何更新state:

A view

B action

答案

1=>B