喜茗
喜茗
  • 发布:2019-10-12 12:38
  • 更新:2019-10-15 22:49
  • 阅读:1217

【报Bug】自定义模式下,页面引用组件,事件回调的箭头函数无法引用页面数据

分类:uni-app

详细问题描述

在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-12 12:38 负责人:无 分享
已邀请:
vishun

vishun

确实不支持箭头函数,但测试可以用这种方式传递:@click=" getItem(item, $event)"

  • 喜茗 (作者)

    好的,谢谢

    2019-10-26 22:18

c***@163.com

c***@163.com

@click=" getItem(item, e)"

  • 喜茗 (作者)

    感谢,我没有表述清楚,我是需要传递两个参数,一个是event对象,一个是渲染的对象。。。

    2019-10-12 16:11

该问题目前已经被锁定, 无法添加新回复