详细问题描述
在macOS 10.15下,使用HbuilderX-2.3.1运行uni-app项目到微信小程序(自定义组件模式);
组件A内定义单个slot,页面B引用组件A时,使用v-for遍历页面数组,渲染数组内数据没问题,但是在事件回调里,使用箭头函数引用数据时报undefined; 切换到template模式就可以
重现步骤
[步骤]
[结果]
[期望]
打印对应的数据
IDE运行环境说明
[HBuilder 或 HBuilderX。如果你用其他工具开发uni-app,也需要在此说明]
HBuilderX-2.3.1
[mac版本号]
macOS 10.15
uni-app运行环境说明
[运行端是h5或app或某个小程序?]
微信小程序(自定义组件模式)
[运行端版本号]
1.02.1910112
附件
[IDE问题请提供HBuilderX运行日志。菜单帮助-查看运行日志,点右键打开文件所在目录,将log文件压缩成zip包上传]
[App问题请提供可重现问题的代码片段,你补充的细一点,问题就解决的快一点]
[可重现代码片段]
定义的组件
<template>
<view class="box">
<slot />
</view>
</template>
<script>
</script>
<style lang="less">
.box{
padding: 10upx;
background: rgba(0,0,0,.2);
}
</style>
页面引用组件
<template>
<view class="content">
<abc>
<view>
<view v-for="(item, i) in list" :key="i">
<view class="item" @click="(e) => getItem(item, e)">{{item.key}}</view>
</view>
</view>
</abc>
</view>
</template>
<script>
import abc from '../../components/abc/abc.vue';
export default {
components: {
abc
},
data() {
return {
list: [{key: 1}, {key: 2}, {key: 3}]
}
},
methods: {
getItem(item, e){
console.log(item)
}
}
}
</script>
<style>
.content {
padding: 20upx;
}
.item{
margin-bottom: 40upx;
margin-top: 40upx;
padding: 0 30upx;
color: #333;
font-size: 28upx;
background: #eee;
}
</style>
联系方式
[QQ]
喜茗 (作者)
好的,谢谢
2019-10-26 22:18