v-for中修改item属性值后页面v-if不改变的问题

最新推荐文章于 2022-09-17 17:50:01 发布
最新推荐文章于 2022-09-17 17:50:01 发布
阅读量825 收藏 2
点赞数
分类专栏： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/asyAdmin/article/details/100536179
版权

  • 乖乖，今天做项目遇到个大问题，debugger 看到脑子疼都没发现什么问题。先看源码
    在这里插入图片描述
    这里是所拿到得数据，手动在每一项里面添加一个bool类型值，进行判断
    在这里插入图片描述
    然后昨天调整了一个小时，今天又花了两个多少小时，电脑差点被我一拳打烂。最后找到了解决方法
    在这里插入图片描述
    因为数据层次太多，render函数没有自动更新，需手动强制刷新。

记录一下

asyAdmin
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
专栏目录
vue对象属性变化时无法刷新v-if、v-show
guanguan0_0的博客
02-15 9449
普通对象赋值方式可能会使v-if和v-show无法刷新，可以使用this.$set(this.obj, 属性名,属性值)的方式来改变对象的值，例子如下： <template> <button @click="handleShow">点击</button> <div v-if="params.isShow">显示出来div<...
解决页面v-for中修改item属性值后页面v-if不改变的问题
qq_43720804的博客
09-07 369
方法：this.$forceUpdate();
页面v-for中修改item属性值后页面v-if不改变的问题
weixin_49030317的博客
07-05 503
页面v-for中修改item属性值后页面v-if不改变的问题 //在所写的事件函数中最底部添加下面这句话就解决了 this.$forceUpdate(); //因为数据层次太多，render函数没有自动更新，需手动强制刷新。添加this.$forceUpdate();进行强制渲染，效果实现。 ...
Vue中v-if失效问题（数据更新，页面没有发生变化）
热门推荐
程邓楠的博客
07-02 1万+
Vue数据更新，页面没有更新 目前做的业务是根据上面表格选中项，动态变化下面对应的表格，效果图如下 问题：console的时候数据一直是有更新的，但是页面始终没有变化 自己尝试了this.$nextTick( ()=>{ .... } ),nextTick()，是将回调函数延迟在下一次dom更新数据后调用，简单的理解是：当数据更新了，在dom中渲染后，自动执行该函数，结果没有实现； 再次尝试了this.$set(this.items,"itemType",selectItem.dictVa..
vue双向绑定不生效、对象中的属性值发生改变页面不会重新渲染问题解决办法
Jeremy Liu的博客
11-18 5484
文章目录vue双向绑定原理方法一 增加一个基本类型的变量方法二 使用整体对象替换方法三 使用vue文档提供的方法 vue双向绑定原理 vue深入式响应原理，当我们在data中声明变量对象，Vue 将遍历此对象所有的 property（如下面的person，list，school，score），并使用 Object.defineProperty 把这些 property 全部转为 getter/setter。 <div v-for="(item,index) in list" :k
解决v-for中使用v-if或者v-bind:class失效的问题
10-17
在Vue.js开发过程中，我们经常会遇到在`v-for`循环中使用`v-if`或`v-bind:class`（简写为`:class`）时遇到一些失效的问题。这主要是由于Vue的渲染机制导致的，理解这个问题的关键在于理解Vue的响应式系统和虚拟DOM的...
Vue v-for中的 input 或 select的值发生改变时触发事件操作
10-14
- 当在`v-for`循环中使用`v-if`时，有时可能会遇到修改`item`属性值但视图不更新的情况。这是因为Vue的响应式系统可能无法检测到深层对象属性的变化。在这种情况下，确保正确地创建和修改数据模型，或者在必要时...
解决vue的 v-for 循环中图片加载路径问题
10-18
本文将深入探讨如何解决Vue的`v-for`循环中图片加载路径的问题。 首先，我们需要理解问题的背景。在一个实际项目中，产品需求要求图片与名称一一对应，但由于没有专门的图片服务器，图片被存储在前端。在这种情况下...
vue计算属性时v-for处理数组时遇到的一个bug问题
08-28
Vue 计算属性中 v-for 处理数组时遇到的 Bug 问题 在 Vue 中，计算属性（Computed Properties）是一种非常有用的功能，可以根据依赖项自动更新视图。但是，在使用计算属性时，需要注意一些潜在的 Bug 问题，特别是...
vue 取出v-for循环中的index值实例
10-16
在这个实例中，我们将详细探讨如何在`v-for`循环中获取元素的索引值以及如何利用这些值进行交互。 首先，让我们回顾一下提供的代码片段： ```html <ul v-for="(item, index) in pcState"> (index)'>{{ item....
vue数据更新后视图不更新解决办法
weixin_44641777的博客
09-17 804
我是在template中用了v-if=flag来控制展示，在js中数据发生改变我发现展示不对，而flag的值确实发生了改变，true和false的定义也没有错误。this.$nextTick这个方法作用是当数据被修改后使用这个方法会。更新数据后调用 this.$forceUpdate() 方法。这个方法会强制更新视图和数据，触发updated生命周期。获取更新后的dom再渲染出来，最后使用了这个方法成功了。经过我一通百度之后用了。
vue.js之v-for循环中动态改变每个item的样式
weixin_34242819的博客
10-12 1848
为什么80%的码农都做不了架构师？>>> ...
Vue v-show/v-if绑定的数据改变时，无法监听数据变化
Yuval的博客
02-15 1万+
原因：向对象中新增属性时，Vue无法监听新增的属性的数据变化，从而无法触发视图的改变   解决：使用 Vue.set() 来新增属性 Vue.set( target, key, value ) 参数： {Object | Array} target {string | number} key {any} value 返回值：设置的值。 ...
利用Vue动态更改Element标签的属性(主要是通过v-if和v-else整个替换实现)
郭宝的博客
09-27 1万+
代码如下： &lt;template&gt; &lt;div&gt; ===============================33、利用Vue动态更改Element标签的属性(主要是通过v-if和v-else整个替换实现)=============================== &lt;div&gt; &lt;button @click="disa...
关于在vue中使用v-for对数组循环，再对数组中对象的某一个属性修改值，试图不更新
Benz_s600的博客
04-20 4167
举个栗子 <template> <div class="box-wrap"> <div class="box-item" v-for="(item,index) in list" @click="edit(index)"> {{item.name}} </div> </div> </template> <scr...
Vue-更改属性（v-bind），显示切换（v-show和v-if）
qq_52347540的博客
09-03 3059
Vue显示切换 显示切换有两种指令 v-show:‘bool’ v-if:‘bool’ 他们的区别是： v-show的实质是改变了元素的diplay属性，只是隐藏了元素，元素本身并没有在代码中消失 v-if的实质是吧元素从dom中删除，直接没有了这个元素，使用我们看不见它了 在平常使用的过程中，频繁切换显示的话就用v-show v-show和v-if用法 在进行是否隐藏和显示的时候，主要看的就是里面的值是否为true或者false 那么我们可以有多种方法进行判断真假 v-show:“ag
Vue如何使用修改v-for循环中动态数组对应的变量值
weixin_43896125的博客
11-02 5624
Vue如何修改v-for循环中数据对应的值举个例子，在开发中你获取到的数组中的性别数据是英文的male 和 female，而要求是用中文显示可以使用计算属性或过滤器方法功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入 举个例子，在开
vue指令篇（v-if,v-for,v-bind,v-model,v-on,计算属性，监听器，过滤器）
qq_45163356的博客
10-28 1064
v-if: v-if=""，绑定data里的属性对象名或者表达式，值为布尔值 例子：v-if=“a” ，data里定义 a ：true 或者 v-if=“a > 3” 定义 a ：4 实战经验：一般通过点击方法修改该值的真假，达到v-if展示隐藏的功能 v-for: 循环数组：<p v-for="(item, index) in list" :key="item.id">{{item}} -- {{index}}</p> 循环对象：<p v-...
怎么在el-table里面获取到el-card v-for中item的值
最新发布
06-07
在el-table中获取el-card中v-for的item的值，你可以使用scoped slots来解决这个问题。具体来说，你可以在el-table-column中使用scoped slots，然后在这个scoped slot中使用el-card组件来渲染数据，这样就可以获取到...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值