getFieldDecorator

来源:10-3 模块化封装-BaseForm(2)

慕九州0186884

2019-03-08

initFormList = ()=>{
    const { getFieldDecorator } = this.props.form;
    const formList = this.props.formList;
    const formItemList = [];
    if(formList && formList.length>0){
      formList.forEach((item)=>{
        console.log(item)
        let label = item.label
        let field = item.field;
        let initialValue = item.initialValue || '';
        let placeholder = item.placeholder;
        let width = item.width;
        if(item.type==='时间查询'){
          const begin_time = <FormItem label="订单时间" key={field}>
            {
              getFieldDecorator('begin_time')(
                <DatePicker showTime={true} placeholder={placeholder} format="YYYY-MM-DD HH:mm:ss"/>
              )
            }
          </FormItem>
          formItemList.push(begin_time)
          const end_time = <FormItem label="~" colon={false} key={field}>
            {
              getFieldDecorator('end_time')(
                <DatePicker showTime={true} placeholder={placeholder} format="YYYY-MM-DD HH:mm:ss"/>
              )
            }
          </FormItem>
          formItemList.push(end_time)
        }else if(item.type === 'INPUT'){
          const INPUT = <FormItem label={label} key={field} >
            {
              getFieldDecorator([field],{
                initialValue:initialValue
              })(
                <Input type='text' placeholder={placeholder}/>
              )
            }
          </FormItem>
          formItemList.push(INPUT)
        }else if(item.type === "SELECT"){
          const SELECT = <FormItem label={label} key={field}>
            {
              getFieldDecorator([field],{
                initialValue:initialValue
              })(
                <Select
                  style={{width:width}}
                  placeholder={placeholder}
                >
                  { Utils.getOptionList(item.list)}
                </Select>
              )
            }
          </FormItem>
          formItemList.push(SELECT)
        }else if(item.type === "CHECKBOX"){
          const CHECKBOX = <FormItem label={label} key={field}>
            {
              getFieldDecorator([field],{
                valuePropName:"Checkbox",
                initialValue:initialValue // 必须是true | false
              })(
                <Checkbox/>
              )
            }
          </FormItem>
          formItemList.push(CHECKBOX)
        }
      })
    }
    return formItemList;
  }

图片描述官网说是String类型,但视频课件上 [field] 是 arry 类型。所以控制台报错了,怎么办??
图片描述

写回答

2回答

学长大人

2019-04-17

    我也是这个总是,请问你解决了吗

0
0

河畔一角

2019-03-10

说的应该不是一个问题。课程里面的field是用来绑定控件的变量,控制台报错的是说一个控件必须有一个唯一的id,这个代表控件的唯一性,你可以用一个随机数字代替id的值即可。另外这只是一个警告,不是一个错误。不会影响开发。

0
1
学长大人
在哪个地方定义id呢,我都试了,还是有警告
2019-04-17
共1条回复

React全家桶+AntD共享单车后台管理系统开发

React全家桶+AntD框架+大量前沿技术

1142 学习 · 495 问题

查看课程