Vue中动态渲染输入框并v-model绑定后无法输入

最近遇到一个根据后台返回来动态渲染表单的需求，但是input在v-model后无法输入了。

原因：Vue无法检测普通的新增属性

解决：通过this.$set()新增

<el-form :model="form":inline="true"><el-form-item v-for="item of data":label="`${item.desc}：`":key="item.value"><el-input size="small":placeholder="item.desc"v-model="form[item.value]" /></el-form-item>
</el-form>export default {data () {return {form: {}}},methods: {// 选择完成式handleSelect () {const index = this.queryList.findIndex(item => item.id === table.value)this.queryList[index].list.map(item => {// this.form[item.value] = ''// 解决方法this.$set(this.form, item.value, '')})this.queryConditions = this.queryList[index].listthis.dialogClose()}}
}

Vue中动态渲染输入框并v-model绑定后无法输入相关推荐

自己解决在Vue中动态渲染图片不显示的问题
乐于助人前言分析思路 1. 绝对路径 2. 相对路径总结本篇文章记录的是自己在 Vue-Cli2 中如何去解决的这个问题,心里路程比较多,所以话比较多哈哈,感谢阅读,大概耗时2分钟前言如上 ...
vue中动态渲染组件
https://blog.csdn.net/qq_42345237/article/details/98348889 https://www.cnblogs.com/moqiutao/p/114403 ...
Vue中动态加载SVG文件并绑定事件、修改节点数据
大致的流程是这样的:实现这个需求是首先通过一个工具(drawio)去自定义绘制图形,然后导出一个svg格式的文件,后端搞了一下drawio工具的源码,在导出的时候,为绘制的图形上每个节点都去绑定了一个 ...
vue中动态引入图片为什么要是require，你不知道的那些事
相信用过vue的小伙伴,肯定被面试官问过这样一个问题:在vue中动态的引入图片为什么要使用require 有些小伙伴,可能会轻蔑一笑:呵,就这,因为动态添加src被当做静态资源处理了,没有进行编译,所 ...
VUE中动态改变字体大小
VUE中动态改变字体大小父组件将自己的数据传递送给子组件展示,子组件监听click操作,emit发送出去,父组件监听通过emit发送的信息,改变控制字体大小的postFontSize,通过style ...
Vue中常用的8种v指令
Vue中常用的8种v指令根据官网的介绍,指令是带有 v- 前缀的特殊属性.通过指令来操作DOM元素指令功能 v-text="变量/表达式" 文本的设置字符串变量+数字可以 ...
Vue中动态添加class写法动态静态clas混合
Vue中动态添加class写法动态静态clas混合示例 //fx,cont-block为静态class ob为动态class <div :class="[ 'fx','cont- ...
vue中动态设置背景渐变色
vue中动态设置背景渐变色 1.效果展示 2.核心(动态更换单一的背景颜色也可以使用) <div class="ss" v-bind:style="{ backgr ...
vue中动态获取dom元素进行操作
这几天我远程面试了一家公司,期间问题我都回答上来了但有一个问题我很纳闷就是你说下vue中获取dom元素的方法吧我说大体上俩中吧 1.vue中 ref的方法给元素起一个ref名称通过 th ...

Vue中动态渲染输入框并v-model绑定后无法输入

Vue中动态渲染输入框并v-model绑定后无法输入相关推荐

最新文章

热门文章