开发者学堂课程【React前端开发入门与实战：React 基础知识—— Mixin 和 表单 】学习笔记，与课程紧密联系，让用户快速学习知识。
课程地址：https://developer.aliyun.com/learning/course/365/detail/4358
React 基础知识—— Mixin 和 表单
目录：
一、MIXIN
二、FORM
三、CONTROLLED COMPONENTS
一，MIXIN
Mixin 是一个普通对象，通过 mixin 可以在不同组件间共享
代码：
var mixin = {
propTypes:{
title: React.PropTypes.string,
getDefaultProps()
return{
title: 'default’
};
},
};
var B=React.createClass({
mixins: [mixin],
Render(){
return <b>{this.props.title}</b>
}
});
React.render(<div>
<B/> <A title={2}/>
<A/>
</div>,document.getelementByld（‘contalner'));
二、FORM
和 html 的不同点:
value/checked 属性设置后，用户输入无效
textarea 的值要设置在 value 属性
select 的 value 属性可以是数组，不建议使用 option 的 selected 属性
input/textarea 的 onChange 用户每次输入都会触发(即使不失去焦点)
radio/checkbox 点击后触发 onChange
三、CONTROLLED COMPONENTS
1.如果设置了 value 属性，那么改组件变为受控组件，用户
无法输入，除非程序改变 value 属性：
var Test= React.createClass({
render（）{
return <input value="x"/>
}
});
React.render(<Test />,document.getElementByIdc"container'));
2.可以通过监听 onChange 事件结合 state 来改变 input 的值：
var Test =React.createClass({
getInitialState(){
return {
value: ‘xasdasdf’
};
},
onChange(e){
this.setState({
value:e.target.value
});
}，
Render(){
return
<input value={this.state.value} onChange={this.onChange}/>
}
});
React.render(<Test />,document.getElementById('container'));
3.设置 defaultValue 为设置 input 的初始值，之后 input 的值由用户输入
var Test m React.createClass({
Render(){
return <input defaultValue="xyz" />
}
});
React.render(<Test />,document.getElementByIdc'container'));
