【小程序】出现 wx:key="{{index}}" does not look like a valid key name (did you mean wx:key="index" ?)

最新推荐文章于 2023-10-13 19:50:30 发布
最新推荐文章于 2023-10-13 19:50:30 发布
阅读量1.2k 收藏
点赞数
分类专栏： 小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_39307273/article/details/104731808
版权

1、出现问题：

<scroll-view class='messScroll' scroll-y bindscrolltolower="lower" bindscrolltolower="getBottom">
   <block class='rankList' wx:for="{{rankList}}" bindtap='showDetail' wx:key="{{index}}">
      <view class="item" data-index="{{index}}" hover-class="item-hover" bindtap="goOtherInfo">
          <view class="item-content">
              <view>
                  <image wx:if="{{index==0}}" src="../../images/match1.png" mode="aspectFit" class="tab-icon" ></image>
                  <image wx:elif="{{index==1}}" src="../../images/match4.png" mode="aspectFit" class="tab-icon" ></image>
                  <image wx:elif="{{index==2}}" src="../../images/match3.png" mode="aspectFit" class="tab-icon" ></image>
                  <view wx:else class="tab-icon">{{index+1}}</view>
              </view>
              <image class="userPhoto" src="{{item.headUrl}}" />
              <view class='name'>{{item.name}}</view>
              <view class='match'>{{item.match}}%</view>
              <view class="tab-arrow"></view>
          </view>
       </view>
    </block>
</scroll-view>

 

2、解决方法

查阅官方文档发现：把key=“{{index}}”的括号去掉，改为引号即可

这里是蒋丞选手
关注
专栏目录
微信小程序 - wx:key警告does not look like a valid key name？（wx:key=“{{index}}“ does not look like a valid ）
王佳斌
08-04 3735
完整警告 遇到这问题的都是陪着微信小程序好久的程序员了。 意思是说，你 for 循环的 key 不应该是这样写吗 wx:key="index"？，为什么要加 {{ }} ？ VM202:1 ./pages/my/my.wxml wx:key="{{index}}" does not look like a valid key name (did you mean wx:key="index" ?) 2 | <image src="{{img}}"></image> 3
微信小程序属性剖析：wx-key就这么重要吗？
flying meng的菜鸟居
06-02 4687
今天，就想和各位说说微信小程序中的【臂膀】——wx-key。 毫无疑问，wx-key在微信小程序中可谓是“大出风头”，这一点尤其在for循环中体现出来。但wx-key的作用，你真的了解吗？ 事实上，作为“唯一标识”，微信小程序也极力提倡在一些组件中使用 我们先来写一个简单的list列表： //wxml <block wx:for="{{arr}}"> <view>{{item}}</view> </block> //js-data data:{
微信小程序-控制台报错:“ wx:key=“{{index}}“ does not look like a valid key name (did you mean wx:key=“index“ “
特战程序员
11-21 3043
<!--pages/index1/index1.wxml--> <view class="main"> <!--公共头部--> <MyTitle></MyTitle> <!--首页导航--> <view class="nav_wrap"> <scroll-view class="nav" scroll-x="x"> <view bindtap="activeNav" data-
wx:key={{ index }}does not look like a valid key name (did you mean wx:key=index?)
TE杨
05-18 3585
先上源代码 <view class="item{{ item.completed ? ' completed' : '' }}" wx:for="{{todos}}" catchtap="switchStateHandle" data-index="{{ index }}" wx:key="{{ index }}"> 报错详情 wx:key="{{ index }}" does not look like a valid key name (did you mean wx:key="index
微信小程序异常：wx:key=“{{index}}“ does not look like a valid key name (did you mean wx:key=“index“ ?)
最新发布
梦凝哲雪
10-13 524
wx:key的注意事项
wx:key="{{index}}" does not look like a valid key name (did you mean wx:key="index" ?
furfur-jiang的博客
02-06 2197
wx:key="{{index}}" does not look like a valid key name (did you mean wx:key=“index” ? 去掉{{}}即可
关于wx:key=“{{index}}“ does not look like a valid key name 相关问题
m0_45953836的博客
01-29 1534
一般人会报错这个：wx:key=“{{index}}“ does not look like a valid key name (did you mean wx:key=“index“?首先我们回顾官方wx:for的使用模式
警告wx:key="{{index}}" does not look like a valid key name (did you mean wx:key="index" ?)
不知道猫咪的博客
02-17 1万+
一、警告如下： VM202:1 ./pages/base/base.wxml wx:key="{{index}}" does not look like a valid key name (did you mean wx:key="index" ?) 2 | <image src="{{img}}"></image> 3 | > 4 | ...
微信小程序wx:for 的使用以及wx:key绑定
weixin_43364458的博客
03-05 6333
wx:for使用以及使用wx:key注意事项
does not look like a valid key name (did you mean wx:key=“index“ ?)
LJJONESEED的博客
06-15 1235
小程序循环，报错 does not look like a valid key name (did you mean wx:key=“index” ?) 修改为这样就好了。
wx:key=“{{index}}“ does not look like a valid key name (did you mean wx:key=“index“ ?)
红尘炼炼心的博客
02-17 1万+
最新微信小程序版本设计后，提示性错误： wx:key="{{index}}" does not look like a valid key name (did you mean wx:key="index" ?) 修改key的写法即可
wx:key=“{{item.id}}“ does not look like a valid key name (did you mean wx:key=“id“
有问题可关注公众号：前端研究院 后台输入问题回复
12-17 2059
报错 <view wx:for="{{list}}" wx:key="{{item.id}}"></view> 改成这样： <view wx:for="{{list}}" wx:key="id"></view>
初学小程序-wx:for出现 does not look like a valid key name警告
weixin_47106279的博客
04-15 1856
初步接触小程序，在使用 wx:for时， <view wx:for="{{arr}}" wx:key="item.id" > 序号：{{index}} 名字：{{item.name}} </view> 出现以下警告： wx:key="item.id" does not look like a valid key name (did you mean wx:key="i...
wx:key（小程序）
qq_35334804的博客
07-10 813
wx:key 的值以两种形式提供字符串，代表在 for 循环的 array 中 item 的某个 property，该 property 的值需要是列表中唯一的字符串或数字，且不能动态改变。保留关键字 *this 代表在 for 循环中的 item 本身，这种表示需要 item 本身是一个唯一的字符串或者数字，...
wx:key的使用及wx:key的值
qq_40095973的博客
05-16 6万+
1：wx:key="字符串"这个”字符串”代表在 for 循环的 array 中 item 的某个“属性”该“属性” 的值需要是列表中唯一的字符串或数字，且不能动态改变。用于被遍历的组件需要多个属性的时候。 //test.js data: { input_data: [ { id: 1, unique: "unique1" }, {...
wx:key作用的自我理解和记录
大脑和心脏都要跳动的97
08-01 4383
在微信小程序wxml页面的数据循环时看到了wx:key属性，   wx:for属性很好理解，就相当于volist{name='zz' id='xx'}中的id或者foreach（$data as $v=&gt;$k）中的$v， 在每一次循环中做一维数组之用。   然后也没看到wx:key的具体作用到什么地方，就有点迷。   网上科普了一下，其是否有效取决于当前页面的数据形式。   ...
最难点For的wx:key，您肯定不知道的！（框架细节十一）
qq_28129039的博客
03-02 7906
A：数据改变，导致重新渲染的两种情况：1：有wx:key的情况（不重新创建，仅改变顺序）添加元素或改变元素顺序导致数据改变时，会校正带有Key的组件（可通过key识别各组件），框架会根据“目前数据”，重新排序各组件，而不是重新创建，使组件保持自身的状态，列表渲染效率高。2：无wx:key的情况（重新创建）添加元素或改变元素顺序导致数据改变时，此时各组件没有key(无法识别各组件)框架会被迫根据“目...
微信小程序 - 高级 - wx:for 与 wx:for-items 与 wx:key - 1
山云的专栏
07-29 9万+
前言： 微信小程序的循环实现，通过wx:for 与 wx:for-items 与 wx:key,那么他的主要使用特点是什么呢？ 1 wx:for 从目前的例子看，wx:for 的使用确实是对数组来做的，参考微信icon示例程序。 示例里面都是对数组进行条件判断，比如iconsizejius就是一个典型的数组。   2 wx:for-items 与wx:for-item 2.1...
微信小程序－wx:for 循环列表
热门推荐
书写人生
05-19 11万+
获取了 N 条信息（具体有多少条不确定），如何在界面中动态呈现出来呢？ .wxml 代码  wx:for="{{items}}" wx:for-index="index" wx:for-item="item"> {{index+1}}、{{item.title}} > 核心代码就是 wx:for，对应一个数组。 而 wx:for-index 指明后面如果要用数组索引的话
小程序 wx:key="{{item.deviceId}}" does not look like a valid key name
05-26
在小程序中，wx:key 是用来标识列表中的每个元素的唯一性的。通常情况下，wx:key 的值应该是列表中每个元素的唯一标识符，并且必须是字符串类型。 如果你的 wx:key="{{item.deviceId}}" 报错了，可能是因为 item.deviceId 不是一个合法的字符串类型。你可以尝试将它转换成字符串类型，例如： ``` wx:key="{{item.deviceId.toString()}}" ``` 或者，你可以尝试使用其他唯一标识符来替代 item.deviceId，例如： ``` wx:key="{{item.id}}" ``` 无论哪种方式，都需要确保 wx:key 的值是每个元素的唯一标识符，并且是字符串类型。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值