props

理解

• 每個(gè)對(duì)象都有props（properties的簡(jiǎn)寫）屬性
• 組件標(biāo)簽的所有屬性都保存在props中

作用

• 通過標(biāo)簽屬性，從標(biāo)簽外向標(biāo)簽內(nèi)傳遞變化的數(shù)據(jù)
• 注意：組件內(nèi)部不要修改props的數(shù)據(jù)

編碼操作

• 內(nèi)部讀取莫格屬性值

// 內(nèi)部讀取某個(gè)屬性值
this.props.name

• 對(duì)props中的屬性值，進(jìn)行內(nèi)容限制和必要性限制

// 第一種方式，react v15.5已經(jīng)棄用
Person.propTypes = {
    name: React.PropTypes.string.isRequired,
    age: React.PropTypes.number
}

//第二種方式（新）：使用prop-types庫(kù)進(jìn)行限制（需要引入prop-types庫(kù)）
Person.propTypes= {
    name: PropTypes.string.isRequired,
    age: PropTypes.number
}

• 拓展屬性：將對(duì)象的所有屬性通過props傳遞

<Person {...person}/>

• 默認(rèn)屬性值

Person.defaultProps = {
  name: 'xx',
  age= 23
}

• 組件類的構(gòu)造函數(shù)

constructor (props) {
  super(props);
  console.log(props);
}