网络编程 
首页 > 网络编程 > 浏览文章

uniapp微信小程序:key失效的解决方法

(编辑:jimmy 日期: 2024/11/25 浏览:3 次 )

uniapp 代码

<template>
  <view>
    <image v-for="(item, i) in fileList" :key="item[urlKey]" :src="/UploadFiles/2021-04-02/item[urlKey]">

编译到 微信小程序

<view>
  <block wx:for="{{fileList}}" wx:for-item="item" wx:for-index="i" wx:key="urlKey">
    <image src="/UploadFiles/2021-04-02/{{item[urlKey]}}">

貌似不支持 :key="item[urlKey]" 这种语法

解决方案:

<template>
  <view>
    <image v-for="(item, i) in fileList" :key="key(item)" :src="/UploadFiles/2021-04-02/item[urlKey]">

使用computed就可以解决了

上一篇:原生js实现自定义滚动条
下一篇:JavaScript实现下拉列表