uniapp 代碼
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
<template> <view> <image v-for="(item, i) in fileList" :key="item[urlKey]" :src="item[urlKey]"></image> </view></template><script> export default { props: { urlKey: {default: 'url'}, fileList: Array } }</script> |
編譯到 微信小程序
|
1
2
3
4
5
|
<view> <block wx:for="{{fileList}}" wx:for-item="item" wx:for-index="i" wx:key="urlKey"> <image src="{{item[urlKey]}}"></image> </block></view> |
貌似不支持 :key="item[urlKey]" 這種語(yǔ)法
解決方案：
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
|
<template> <view> <image v-for="(item, i) in fileList" :key="key(item)" :src="item[urlKey]"></image> </view></template><script> export default { props: { urlKey: {default: 'url'}, fileList: Array }, computed: { key() { return e => e[this.urlKey] } } }</script> |
使用computed就可以解決了
到此這篇關(guān)于uniapp微信小程序:key失效的解決方法的文章就介紹到這了,更多相關(guān)uniapp小程序key失效內(nèi)容請(qǐng)搜索服務(wù)器之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持服務(wù)器之家！
原文鏈接：https://segmentfault.com/a/1190000039035350
