vuejs/jsx-vue2

Form Component with model props throws error

shishiyong opened this issue · 1 comments

vue : 3.0.0
element-plus:1.0.2

code:

function renderFrom(h) {

const { formConfCopy } = this;
return (
  <el-row gutter={formConfCopy.gutter}>
    <el-form
      size={formConfCopy.size}
      label-position={formConfCopy.labelPosition}
      disabled={formConfCopy.disabled}
      label-width={`${formConfCopy.labelWidth}px`}
      ref={formConfCopy.formRef}
      props={{ model: this[formConfCopy.formModel] }}
      rules={this[formConfCopy.formRules]}
    >
      {renderFormItem.call(this, h, formConfCopy.fields)}
      {formConfCopy.formBtns && formBtns.call(this, h)}
    </el-form>
  </el-row>
);

}

props={{ model: this[formConfCopy.formModel] }} It doesn't work

just warning
[Element Warn][Form]model is required for validate to work!

It seems that you should set props by spread operator like this

<el-form
  {...{
    props: {
      model: this[formConfCopy.formModel],
    },
  }}
>
  ...
</el-form>