v-for遍历的多个组件切换图片 如何不相互影响？-灵析社区

所以你的 `` 组件中的 `src` 值为啥是 `yl`，而不是 `item.src` ?? #### Edit 1 所有的 `van-image` 组件的 `src` 属性共用 1 个变量了，那你操作了 `yl` 肯定会影响到所有的使用到 `yl` 变量的 `image` 组件。 * * * #### Edit 2 看你的描述和截图，大概的业务需求是这样的。 循环渲染一个**折叠版面** 里面有一个自定义的**按钮切换Tags组件** ，每次切换Tag会联动修改这个自定义组件同级的**图片展示** 组件的 `src` 属性来期望展示不同的预览图。 所以你可以在 `data` 这个对象数组中的 `item` 中增加一个 `preview` 属性。每次切换的时候取去修改对应的 `preview` 属性，比如说： - + changeTab(url, index)" > - + export defaut { methods: { changeTab(url, index) { this.$set(this.data[index], 'preview', url) } } } // 数据示例 const data = [ { title: "潜在分布区预测", id: '1', preview: '', category: [ ... ] } ] * * * 当然你也可以换一个思路，既然你的 `` 组件都有一个 `active` 属性了。那么直接就用这个绑定的 `current` 属性来控制 `` 的 `src` 属性也可以，但是我看了一下你的 `current` 变量也是有问题的，修改一个应该全部都会被修改掉。所以稍作修改可以这样来处理： - + onTagsChange(name, index)" > - + export defaut { methods: { onTagsChange(key, index) { this.$set(this.data[index], 'active', key) }, getPreviewImage(list, activeName) { const activeData = list.find(data => data.name === activeName) return activeData.src } } } // 数据示例 const data = [ { title: "潜在分布区预测", id: '1', active: '鱼卵潜在分布区', category: [ ... ] } ]