默认值
我们在编写组件的时候，其实好多时候，我们都想组件的参数是可选参数，如果没有这个参数，我们就默认给上一个参数，在vue 中我们可以在模板中的props中定义属性名，然后default就有默认值了。但是在react 中我们如何来实现这个呢？
react 组件类型有两种，然后给默认值也是有两种方法的
方法一：利用js的天生优势——混合
类组件
使用案列如下：
上面我的使用方式是在render里面的，这个也可以是constructor里面来进行属性的赋值，具体的使用方式，根据实际情况而定，只要满足在render的前面完成属性的赋值即可。
函数组件
类组件其实的本质也是函数组件，类组件中可以使用混合来实现，在函数组件也是可以的
使用案列如下：
函数组件的混合只要在 return前面就可以哦
方法二： react 提供了语法糖——defaultProps
defaultProps 的原理就是，在组件的运行过程中，先把属性的默认值喝传入的props 进行混合。这个其实就是一个语法糖
函数式组件
import React from 'react' export default function FuncDefault(props) { console.log(props);//已经完成了混合 return ( <div> a:{props.a}，b:{props.b}，c:{props.c} </div> ) } //属性默认值 FuncDefault.defaultProps = { a: 1, b: 2, c: 3 }
类组件
import React from 'react' export default class ClassDefault extends React.Component { // 然后我们也可以使用es6的方式，在函数的属性上其实就是静态属性，然后延申了一种写法，建议这么写，在组件内部看起来非常的清晰了然。 static defaultProps = { a: 1, b: 2, c: 3 } constructor(props) { super(props); console.log(props); } render() { return ( <div> a:{this.props.a}，b:{this.props.b}，c:{this.props.c} </div> ) } } // 这样赋值喝函数组件时一样的 // //属性默认值 // ClassDefault.defaultProps = { // a: 1, // b: 2, // c: 3 // }
在类组件中，混合是发生在constructor之前就完成混合了哦
