美文网首页
vue动态绑定v-model

vue动态绑定v-model

作者: King斌 | 来源:发表于2021-06-07 12:21 被阅读0次

    使用this.$set进行绑定和赋值

        getFormData() {
          const map = this.dataInfo?new Map(Object.entries(this.dataInfo)):new Map();
          getForm(this.formInfo.formId).then(res => {
            if (res.data) {
              this.file = res.data.file
              let list = JSON.parse(res.data.json)
              for (var i = 0; i < list.length; i++) {
                this.drawingList.push({
                  ...list[i], 'modelName': list[i].vModel
                })
              }
              this.$set(this.dataForm, "id",map.get("id")?map.get("id"):'')
              for (var i = 0; i < this.drawingList.length; i++) {
                this.$set(this.dataForm, this.drawingList[i].modelName,map.get(this.drawingList[i].modelName)?map.get(this.drawingList[i].modelName):'')
                if (this.drawingList[i].required) {
                  let msg = this.drawingList[i].label + '必填'
                  this.drawingList[i].regList.push({ required: true, message: msg, trigger: 'blur' })
                }
                this.$set(this.rules, this.drawingList[i].modelName, this.drawingList[i].regList)
              }
              this.loading = false
            } else {
              this.$message.error('获取表单内容失败!')
              this.loading = false
            }
          })
        }
    

    使用model[element.name]绑定

      <el-form-item v-if="element.tagIcon=='number'" :label="element.label" :prop="element.modelName">
                <el-input-number v-model="dataForm[element.modelName]" :placeholder="element.placeholder"
                                 :maxlength="element.maxlength"
                ></el-input-number>
              </el-form-item>
    

    相关文章

      网友评论

          本文标题:vue动态绑定v-model

          本文链接:https://www.haomeiwen.com/subject/xztceltx.html