Vue3根据动态字段绑定v-model的操作代码_vue.js_

搜索

export default { name: "TableSearch", props: { formArray: { type: [Object, Array], default: () => {}, //这边是箭头函数 }, }, data() { var dataInit = { formInline: {}, //查询条件form }; return dataInit; }, watch: { // 处理循环的数据 formArray() { this.formArray.map((item) => { if (item && item.model && item.modelValue) { this.$set(this.formInline, item.model, item.modelValue); } }); }, }, methods: { //搜索 SeachHanler() { this.$emit("on-search", this.formInline); } }, mounted() {}, created() {}, }; 

 data() { return { formArray: [ { componentType: "input", type: "text", model: "UserName", modelValue: "用户1", placeholder: "请输入用户名1111", label: "用户名111", id: "1", }, { componentType: "input", type: "text", model: "Phone", modelValue: "11111", placeholder: "请输入电话", label: "电话", id: "2", } ] }; },