1.修改state中的对象和数组
//添加或修改对象
this.setState({
object: {...this.state.object, key: value}
});
//删除数组某一项
let temp=this.state.array;
temp.splice(index, 1);
this.setState({
array:temp
});
//数组首部添加和尾部添加
this.setState({
array: [item, ...this.state.array]
});
this.setState({
array: [...this.state.array, item]
});
//数组某一位置添加
let temp=this.state.array;
temp.splice(index, 0,item);
this.setState({
array:temp
});
2.[Antd] Warning: You cannot set a form field before rendering a field associated with the value.
对form表单进行初始化的时候,应该使用initialValue,动态改变表单中的值应该使用setFieldsValue。
{/*在使用Select时,如果value和label不一致要动态设置label时,使用value+""*/}
<Form.Item label="资源类型">
{getFieldDecorator('type', {
initialValue:this.props.rowInfo.type?this.props.rowInfo.type+"":1+""
})(
<Select placeholder="请选择">
<Option value="1">目录</Option>
<Option value="2">模块</Option>
<Option value="3">页面</Option>
<Option value="4">Action</Option>
</Select>
)}
</Form.Item>
3.设置DatePicker的初始值,需注意对象和字符串的转换
import moment from 'moment';
<Form.Item label="创建时间">
{getFieldDecorator('addTime',{
initialValue:this.props.rowInfo.addTime?moment(this.props.rowInfo.addTime, 'YYYY/MM/DD'):null
})(<DatePicker />)}
</Form.Item>
this.props.form.validateFieldsAndScroll((err, values) => {
if (!err) {
if(values.addTime)
values.addTime=moment(values.addTime).format('Y-MM-DD HH:mm:ss');
else
values.addTime=""
...
}
});
4.给TreeNode添加删除、编辑等操作按钮,可在title属性中使用jsx。
<TreeNode key={v.id} title={
<span>
{v.name}
<Icon type="delete" title="删除当前项" onClick={_this.removeProject.bind(_this,v)}/>
<Icon type="form" title="编辑当前项" onClick={v.type==1?_this.editProject.bind(_this,v):_this.editEntity.bind(_this,v,2)}/>
</span>
}>