Props
我们可以在组件的属性上传入属性值,通过传入属性值让组件接受外部的数据而更改自身的状态。
1
| <component-name myObj={{ name: 'Eno Yao' }} />
|
组件内部通过props接受即可:
1 2 3
| <template name="component-name"> <p>{props.myObj.name}</p> </template>
|
我们还可以通过static defaultProps
设置默认的props值和通过static propTypes
设置默认的props类型。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19
| <template name="component-name"> <div> <p>{props.name}</p> <p>{props.age}</p> </div> </template> <script> export default class { static defaultProps = { name: 'Omi', age: 18 }
static propTypes = { name: String, age: Number } } </script>
|