react hooks 父子传值
父传子
- 在父组件中用useState声明数据
const [ data, setData ] = useState(false)
- 把数据传递给子组件
<Child data={data} />
- 子组件接收
export default function (props) {
const { data } = props
console.log(data)
}
子传父
子传父可以通过事件方法传值,和父传子有点类似。
- 在父组件中用useState声明数据
const [ data, setData ] = useState(false)
- 把更新数据的函数传递给子组件
<Child setData={setData} />
- 子组件中触发函数更新数据,就会直接传递给父组件
export default function (props) {
const { setData } = props
setData(true)
}
- 如果存在多个层级的数据传递,也可依照此方法依次传递