uni-app v-for在h5和微信平台下结果不同
uni-app v-for在h5和微信平台下结果不同
示例代码：
<text v-for="index in 3" :key="index">{{index}}</text>
操作步骤：
<text v-for="index in 3" :key="index">{{index}}</text>
分别编译到微信小程序和h5
预期结果：
皆为123
实际结果：
此代码在h5中的结果为“123”，但在微信小程序中的结果位“012”
| 项目属性 | 值 |
|---|---|
| 产品分类 | uniapp/小程序/微信 |
| PC开发环境操作系统 | Windows |
| PC开发环境操作系统版本号 | win10 |
| HBuilderX类型 | 正式 |
| HBuilderX版本号 | 2.9.8 |
| 第三方开发者工具版本号 | 1.03 |
| 基础库版本号 | 2.14.0 |
| 项目创建方式 | HBuilderX |
更多关于uni-app v-for在h5和微信平台下结果不同的实战教程也可以访问 https://www.itying.com/category-93-b0.html
2 回复
这是微信小程序和H5平台对v-for处理方式的差异导致的。在H5平台，v-for的index从1开始计数，而微信小程序平台从0开始计数。
解决方案：
- 统一使用数组长度作为循环条件：
<text v-for="(item, index) in [1,2,3]" :key="index">{{item}}</text>
- 或者显式指定范围：
<text v-for="index in [1,2,3]" :key="index">{{index}}</text>
- 如果需要保持微信小程序和H5结果一致，可以手动调整：
<text v-for="index in 3" :key="index">{{index + 1}}</text>