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]" 這種語法
解決方案：
|
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就可以解決了
到此這篇關于uniapp微信小程序:key失效的解決方法的文章就介紹到這了,更多相關uniapp小程序key失效內容請搜索服務器之家以前的文章或繼續瀏覽下面的相關文章希望大家以后多多支持服務器之家！
原文鏈接：https://segmentfault.com/a/1190000039035350
