el-dialog里的数组不更新,在关闭的一瞬间更新了

简介: el-dialog里的数组不更新,在关闭的一瞬间更新了
<el-dialog title="拆单" :visible.sync="dialog_split">
    <div v-for="(item, i) in split_goods_json" >
        <el-input v-model="split_goods_json[i].split_number" style="width: 150px;">
        </el-input>
    </div>
</el-dialog>


但是在方法中更新数据不会重新渲染,其实这个问题的本质也不是dialog的问题,而是vue的机制问题,


https://cn.vuejs.org/v2/guide/reactivity.html


Vue 不能检测以下数组的变动


当你利用索引直接设置一个数组项时,例如:vm.items[indexOfItem] = newValue 当你修改数组的长度时,例如:vm.items.length = newLength 为了解决第一类问题,以下两种方式都可以实现和 vm.items[indexOfItem] = newValue 相同的效果,同时也将在响应式系统内触发状态更新:


// Vue.set
Vue.set(vm.items, indexOfItem, newValue)
// Array.prototype.splice
vm.items.splice(indexOfItem, 1, newValue)
目录
相关文章
|
9月前
layui根据数据状态判断显示内容
layui根据数据状态判断显示内容
295 0
|
JavaScript
VUE element-ui之table双表头遍历及筛选自动(回车查询)、重置、关闭dialog重置
VUE element-ui之table双表头遍历及筛选自动(回车查询)、重置、关闭dialog重置
711 0
VUE element-ui之table双表头遍历及筛选自动(回车查询)、重置、关闭dialog重置
|
9月前
|
前端开发
elementui解决el-dialog不清空内容的问题,el-dialog关闭时销毁子组件
elementui解决el-dialog不清空内容的问题,el-dialog关闭时销毁子组件
element中的el-select中多选回显数据后没法重新选择和更改
element中的el-select中多选回显数据后没法重新选择和更改
|
6月前
|
JavaScript
成功解决:el-dialog弹出窗口、数据第一次没有加载、第二次打开才能加载数据。(每次页面刷新后、第一次打开dialog窗口、图片数不加载)
这篇文章分享了解决Vue中`el-dialog`弹出窗口在第一次打开时数据未加载问题的技巧,通过改变组件的`key`属性来强制Vue重新渲染DOM,从而确保数据正确加载。
成功解决:el-dialog弹出窗口、数据第一次没有加载、第二次打开才能加载数据。(每次页面刷新后、第一次打开dialog窗口、图片数不加载)
|
9月前
|
JavaScript
当需要频繁地切换DOM元素的显示状态时,应该使用`v-if`还是`v-show`?
当需要频繁地切换DOM元素的显示状态时,应该使用`v-if`还是`v-show`?
164 1
|
JavaScript 前端开发
vue的v-if隐藏不了元素失效问题,因为display:none; 失效,所以元素还显示
vue的v-if隐藏不了元素失效问题,因为display:none; 失效,所以元素还显示
823 0

热门文章

最新文章