react 中的 三大重要属性state refs props

react 中的 三大重要属性state refs props

React中 的三大属性还是挺重要的呢

 

那今天我们就来说一下 这React中的三大属性叭！

分别是 state refs props

 

No.1 ： state

 

state 它的作用是 初始化指令

1 constuctor(){
2     super() // 这是必写的 super
3     
4     this.state = {
5         stateName  : value
6     }
7 }

读取的话就是使用

this.state.stateName

这就是给它 初始化值的方式

如果想修改state中的值，在事件成员函数中如何修改state呢

fn(){
    this.setState(){
        stateName : 'newname'
})

不能采用 this.state.属性 = 值    这种办法来修改的哦

 

接下来就是第二个Props 啦

 

Props 是组件标签上的属性，都纪律在自定义组件中一个props属性上

 

　

这里在组件上写的属性为 name age 两个属性

那如何访问props呢

{this.props.age}
{this.props.name}

就这样 直接获取就可以获取到啦

 

注意 props 中的值不能改变      state中值的可以改变

这里补充一点点 props中的知识

propstType 和 defaultProps

 

propsType 是 验证props中的数据类型必须合法

defaultProps 是 设置props的初始值

 

这里简单说一下 defaultProps的用法叭

 

 这个是第一种用法；也是经常使用的用法

App.defaultProps = {
    name : 'handsome',
    age : 22
}

　　

这是第二种用法

class App extends React.component{
    static defaultProps = {
        name : 'handsome'
    }
}

 

那 props 就说完啦，接下来是第三个 Refs

Refs 它就是通过操作虚拟dom来获取真实dom

如何获取真实dom

　　第一种就是 ref 后面是字符串

　　1.给想要获取的元素身上加ref属性

Hello World

aa 这个值就会在  refs 对象中 充当一个属性 属性值是dom元素

 

 

第二种ref 后面是一个箭头函数

 h3xx 是一个临时存放dom元素的属性 ，在这个属性直接挂载在组件对象上

 

 

 这就是 ref用法

 

 

 

 

 

posted on 2019-09-05 19:38  blankOne 阅读( ...) 评论( ...) 编辑 收藏

转载于:https://www.cnblogs.com/blankOne/p/11469185.html