element-ui 表格 修改后, 表格里面的数据 页面不实时更新问题 完美解(2)

最新推荐文章于 2024-05-04 12:10:44 发布
最新推荐文章于 2024-05-04 12:10:44 发布
阅读量343 收藏 9
点赞数 4
分类专栏： 程序员 文章标签： ui
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/2301_79098879/article/details/137447457
版权

未成功，点击一个"更多"，其他所有的"更多"都隐藏起来了

原因1：

循环的时候show给了表格所有的行，所以点击一个"更多"导致所有的"更多"都隐藏了；

做法2：

给"更多"绑定一个v-show='(scope.$index+1)' ，理想状态是：索引最低是0，+1后，至少也为1,所以显示，给删除和补仓设置为 v-show='!(scope.$index+1)' 取反就是隐藏了；

结果2：

未成功，报错

最低0.47元/天 解锁文章
2301_79098879
关注
  • 4
    点赞
  • 踩
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
element-ui 表格 修改后, 表格里面的数据不实时更新问题
github_37759996的博客
05-14 3253
element-ui 表格 修改后 表格里面的数据后 页面不实时更新问题 完美解 想要达到的效果：点击"更多"后，"更多"隐藏，删除和补仓显示；（有时间可全部看完，没时间直接看做法6/7） 尝试用的方法：自己用 this.show、在百度上找的方法 set 都没能成功 提示：最下面有代码demo 页面初始化： 目标效果 做法1： 给"更多"绑定一个 v-show=‘show’ 把 this.show 设置为true ，点击"更多"按钮后 在点击事件里面把this.show 设置为false； 结果1： 未成
element-ui表格数据转换的示例代码
10-18
主要介绍了element-ui表格数据转换的示例代码，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
el-table中的el-input标签修改值，但界面未更新，解决方法
YaoQing222的博客
11-02 1470
el-table里的el-input未生效
el-table嵌套input事件数据修改后没有对整个表格重新渲染
ivanchen7777的博客
04-17 177
试过添加key和行key，表格确实重新渲染了，但是input框会失去焦点无法继续输入。table嵌套input后，blur事件就失效了不知道为啥所以不采用。需求是在input里的值修改后别的行的数据也相应变化，但是更改input值后只渲染了那一行的数据，别的行数据已经更改但是表格并没有更新。但是并没有生效，最终使用下面的方法解决。
el-table数据更新组件不更新解决办法
weixin_41437681的博客
01-08 1172
el-table数据更新组件不更新解决办法：可以在更新el-table数据后去调用this.$forceUpdate();
el-table 里面嵌套el-input 数据改变了但是页面没有同步更新（全网最全）
weixin_44875212的博客
03-21 1093
el-table 里面嵌套el-input 数据改变了但是页面没有同步更新（全网最全）
el-table表格数据变化，页面不更新问题
z1756370的博客
11-09 3487
el-table表格数据变化，页面不更新问题
el-table 表格数据更新
qq_66953312的博客
06-06 1081
el-table中data不及时更新或getSummaries结果不及时更新。
element-ui 表格数据时间格式化的方法
12-02
在element-ui table 如何格式化呢  1.首先 代码如下:”AuditEndTime” label=”处理时间” width=”120″ formatter=”dateFormat” align=”center”>  主要是:formatter=”dateFormat” 这个属性  formatter...
element-ui表格合并span-method的实现方法
10-16
主要介绍了element-ui表格合并span-method的实现方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
vue+element-ui表格封装tag标签使用插槽
10-15
主要介绍了vue+element-ui表格封装tag标签使用插槽，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
Element UI树形表格数据更新问题解决指南
最新发布
qq_44103359的博客
05-04 359
在Element UI的el-table组件中，当处理树形结构数据时，如果遇到新增或修改数据后无法自动刷新的问题，这通常是由于数据结构的处理方式不正确导致的。
解决el-table数据发生了变化，但是页面显示的数据不更新问题
qq_46103732的博客
06-06 3376
解决el-table数据发生了变化，但是页面显示的数据不更新问题。 通过修改绑定在 table 上面的 key 值，可以触发 el-table 的重新渲染，首先给表格绑定一个key： 在数据发生变化后更新key的值：
ElementUI中input回车触发页面刷新问题及其解决方法
terence的博客
06-05 3372
在日常的开发过程中，你可能会遇到一个问题：在ElementUI的el-form表单中，如果只存在一个el-input输入框，当你输入值后按下回车，页面会发生刷新。这是因为当form元素中只有一个输入框时，按下回车将触发表单的默认提交事件，这是W3C标准的规定。
elementUI中input回车触发页面刷新问题和解决方法
GG_Zdd的博客
03-31 6661
了解并解决elementUI中form表单内单一input框回车触发刷新的问题
elementUI 树形表格数据刷新，子节点数据采用触底加载
m0_73533910的博客
04-18 1387
2.在第一次获取数据时将节点数据保存到map中，如果子节点数据长度大于首次加载数量，则截取首次加载数量的数据渲染，resolve()中是子节点的数据。每次表格展开先取出map中存的数据，再根据条件截取出要渲染的数据，使用this.$set()方法更新视图刷新。this.$set()传入的参数分别是：组件懒加载数据的节点，被操作的节点的父节点，父节点下要渲染的数据。1.先使用map保存数据，在data中定义。4.当出现滚动条时，再加载数据并刷新。这样，树形表格数据触底加载就可以了。
elementUI 的 table 表格改变数据不更新问题
热门推荐
weixin_43299180的博客
04-28 2万+
预期效果：点击输入框旁边的图标，输入框变为可输入状态；这里控制输入的 editable 字段不是 data 原有的属性，也不是 data 赋值时就存在的字段。 问题原因：在 Vue 实例创建时，以及 data 赋值时 editable 并未声明，因此就没有被Vue转换为响应式的属性，自然就不会触发视图的更新。 解决方法： 1、给 data 赋值前把 editable 属性添加到数组里 这里就不贴代码了，大概思路就是：获取到列表信息之后缓存在一个临时数组里（不可以是 data 里面定义好的对象），循环遍历
【前端踩坑】elementUI表格el-table数据排序/更新后，不重新渲染（页面数据不更新）
weixin_44649384的博客
12-30 4755
查看element文档，数据需要设置key，但是用el-table提供的row-key不太好用。这里预测是，前后数据内容一致，dom不更新，可能是为了提升页面性能。给table增加一个随机key，每次重新赋值tableData的时候，也传递随机key值，这样页面就可以重新渲染el-table了。前端页面选择重新排序，重新向后端请求数据，排序规则改变但数据内容不不变，表格数据不重新渲染。
element-ui 表格弹窗
04-28
element-ui 表格弹窗是 element-ui 组件库中提供的一种专门用于展示数据的弹窗组件，常常用于在表格中进行详细数据展示或编辑、删除等操作时使用。它可以通过传入一些参数实现自定义内容、弹窗大小等操作。 它的使用非常简单，只需要在需要使用的地方导入该组件，然后通过一些设置即可实现相应的功能。例如，在表格中点击某一行时可以弹出该行数据的详细信息，可以通过监听 `row-click` 事件，并在其中使用 `this.$refs.table.showTooltip()` 方法来弹出该行数据的详细信息。此外，还可以通过设置 `size` 属性来改变弹窗大小，也可以通过设置 `content` 属性来实现自定义的弹窗内容。 总之，element-ui 表格弹窗是 element-ui 组件库中非常实用的一个组件，可以提高数据展示的效率，让用户更加方便快捷地查看和操作数据。在实际开发中，我们可以根据实际情况灵活使用该组件，提高项目的开发效率和用户体验。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值