form-create使用总结_formcreate

给表单项加className方便调整样式

rule: [
{
   
          type: 'input',
          title: '货物总毛重（KG）', // label名称
          field: 'totalGrossWt', // 字段名称
          value: '', // input值,
          col: {
   span: 16, labelWidth: 50%},
          className: 'total-gross-wt',
          props: {
   
            type: 'text',
            clearable: true, // 是否显示清空按钮
            placeholder: '请输入...'
          },
          validate: [{
   
            pattern: /^(0|[1-9]\d*)(\s|$|\.\d{1,3}\b)/, // /^[0-9]+([.]{1}[0-9]{1,3})?$/,
            message: '请正确输入毛重，最多3位小数',
            trigger: 'blur'
          }]
        }
]
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24

$f.updateRule动态更新select类型表单的options不成功

如果options有值，然后通过以下方式清空，无效，原因未知。目前改用$f.set或者$f.model()

$f.updateRule('distDestPlace',{
   
  options:[]
})
1
2
3
4

$f.updateRule更新不成功可以用$f.set或者$f.model()

// 例如动态设置select options的方法
this.updateSelectOption('distDestPlace', [])
updateSelectOption (field, value) {
   
      let $f = this.model
      let index = $f.fields().indexOf(field)
      $f.set($f.rule[index], 'options', value)
    },
1
2
3
4
5
6
7
8

或者

$f.model()[field].options = []
1

全局配置中的onReload，mounted

• mounted：表单创建成功后回调函数（只执行一次）
• onReload：调用$f.reload()会执行

$f.bind，$f.model，