当前位置:   article > 正文

react中state和props的区别_react用usestate获得store和直接props获取有什么区别

react用usestate获得store和直接props获取有什么区别
state
  • 用来存储组件内部的数据状态
  • 需要通过setState进行修改,而setState是异步的,需要立即获取最新的状态时使用第二个参数(回调函数),代表更新state完成。如果懒得每一次都是用回调函数,也可以使用promise+async+await进行封装,用同步的思想写异步操作。
this.setState({age:12},()=>{console.log(this.state.age);//=>12})
  • 1
  • 只能在构造器constructor中进行初始化
  • 只存在于有状态组件中
props
  • 父子组件沟通的一个桥梁
  • 子组件不能修改它(只读性),想要更新props,需要通过父组件更新,或者在子组件设置state,接收props,使用setState间接更新,否则页面会无效。(根本原因react数据流自顶向下、单向数据流)
  • props是一个对象,可以接收函数、键值、嵌套组件等
  • 可以使用this.props.key获取值,也可以使用es6进行解构
let {age,name}=this.props;
  • 1
  • 可设置默认参数值,如果父组件未定义参数值,但传递了参数名称,默认值为true,同时也可以对传递过来的参数进行类型检查
ComponentName.defaultProps = {
    name:18,
     title: propsTypes.string.isRequired//类型检查 必传参数
}
  • 1
  • 2
  • 3
  • 4
  • 可以存在有或者无状态组件中,我们应该尽可能降低代码耦合度,划分有状态和无状态组件,有利于维护。
声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/花生_TL007/article/detail/63390
推荐阅读
相关标签
  

闽ICP备14008679号