美文网首页
Vue中点击当前列表项,显示列表详情,其它列表项隐藏

Vue中点击当前列表项,显示列表详情,其它列表项隐藏

作者: 一纸晴空 | 来源:发表于2023-10-22 10:26 被阅读0次

当碰到这种需求的时候,对于一个新手来来说,如何解决这个问题?

首先,沿着Vue数据驱动的思想来考虑问,每个列表的每一项,是不是需要一个数据来控制显隐(用v-if或者v-show来控制,后者用于切换频繁时使用)?

后台在返回数据时,不一定给你返回一个专门控制列表显隐的字段。所以我们要对后台返回的数据进行二次加工,添加一个新字段,来满足我们的需求。

这里存在一个问题,有人问:为什么我加了数据,但是没有效果。这是因为你在添加数据的时候没有使用vue.set(obj, newKey, newValue)这个方法来添加数据。使用此方法添加的数据是响应式的。

文章来源:https://sxd.now.sh/

相关文章

  • 列表

    1、无序列表: 无序列表始于 标签 每个列表项始于 标签 2、有序列表: 有序列表也是一列项目,列表项目使用数字...

  • 有序列表与无序列表

    1.有序列表: 有序列表同样,有序列表也是一列项目,列表项目使用数字进行标记。有序列表始于标签 。每个列表项始于 ...

  • 2018-05-31

    我的世界 #我的世界# * 这是一个列表项 这是第一列表项中的第二个段落 * 这是列表的另一个项目

  • markdown常用的语法

    列表 有序列表: 列表项 1 列表项 2 无序列表: 列表项 1 列表项 2 列表项 3 列表项 4 列表项缩进两...

  • 自定义右键菜单

    当鼠标右击文档的时候,创建一个列表显示在文档中,不要出现默认的菜单。点击其中的列表项,给这个列表项设置特殊的背景颜...

  • Markdown语法测试

    我是一个标题# 我也是一个标题## 我是引用嵌套引用多重嵌套试试这里是第几块引用块中的标题 列表项1 列表项2 列...

  • HTML第三天

    列表标签 无序列表标签:ul 列表项1 列表项2 列表项3 ...... 中只能嵌套 ,直接在 标记中...

  • 「DOM 编程」列表操作

    列表操作 列表的常用形式有图片形式与信息形式的,常见的有如下的操作: 显示列表 选择列表项 新增列表项 删除列表项...

  • Markdown 练习

    认识和入门Markdown 一级标题 二级标题 三级标题 列表项1 列表项2 列表项3 列表项4 列表项 列表项 ...

  • Html阶段第二小节第一天

    1.有序列表标签 列表标签和列表项标签之间一般不穿插其它标签,列表项标签之间可以穿插其它标签。 2...

网友评论

      本文标题:Vue中点击当前列表项,显示列表详情,其它列表项隐藏

      本文链接:https://www.haomeiwen.com/subject/uabridtx.html