微信小程序 - wx:for 循环渲染多个 “重复“ 子组件（仅子组件 id 不同，this.selectComponent 使用时依然能准确找到子组件）将子组件 id 设为动态每个子组件都是独立的！_微信小程序selectcomponent

前言

本教程更多版本：Vue.js | uni-app

我们会通过给组件绑定 id 值，然后通过 this.selectComponent(‘xxx’) 来获取这个组件实例，从而访问子组件方法和变量。

如果 在 wx:for 中循环渲染组件（绑定固定 id），那么这个 id 就会 “一摸一样”，导致根本无法找到（this.selectComponent 谁？），

要解决这个问题，就需要 动态绑定不一样的 id 属性值，并且最终咱们的程序还能 “自动化” 找到它。

如下图所示，支持 Vue2 / Vue3 语法，当点击父组件按钮时，调用子组件方法设置文本的效果，

子组件被 wx:for 循环包裹渲染多个，由于每个子组件 id 不同，所以它们都是 ”独立“ 的，

仅完成了核心功能，代码干净整洁注释详细