1***@qq.com

发布：2022-11-17 12:22
更新：2022-11-18 15:25
阅读：320

【报Bug】微信小程序 VUE3 setup语法糖使用混入后，拿不到组件内的属性。

分类：uni-app

bug反馈

产品分类： uniapp/小程序/微信

PC开发环境操作系统： Mac

PC开发环境操作系统版本号： 13

HBuilderX类型：正式

HBuilderX版本号： 3.6.4

第三方开发者工具版本号： v1.0.6

基础库版本号： vue3

项目创建方式： HBuilderX

示例代码：

组件Index  
<template>  
        <button @click="clickApi">clickApi</button>  
    </template>  

    <script setup name="demo-index">  
    const clickApi = () => {  
        console.log('clickApi');  
    };  
    </script>

混入  
export default {  
        onShow() {  
            console.log(this.clickApi)  
        },  
}

操作步骤：

组件index中创建clickApi 方法，使用全局混入，然后再混入onShow中打印this.clickApi 输出为undefined

预期结果：

输出clickApi 方法

实际结果：

输出undefined

bug描述：

在main.js 引入全局混入js,组件使用setup语法糖，然后在混入 onShow 中获取不到组件中的clickApi方法，不使用setup语法糖，使用setup方法好用。

2022-11-17 12:22 负责人:无分享

2 个回复

最佳回复

DCloud_UNI_WZF

https://github.com/vuejs/core/issues/5169

DCloud_UNI_WZF

setup 语法糖中没有this

1***@qq.com (作者)

这个是混入js里面的this，用setup方法都可以拿到这个方法，难道setup语法糖拿不到吗

2022-11-18 13:58
DCloud_UNI_WZF

回复 1***@qq.com: 这是vue框架的限制，你可以创建一个普通vue项目，build之后是同样的问题

2022-11-18 15:15

要回复问题请先登录或注册

【报Bug】微信小程序 VUE3 setup语法糖使用混入后，拿不到组件内的属性。

示例代码：

`组件Index <template> <button @click="clickApi">clickApi</button> </template> <script setup name="demo-index"> const clickApi = () => { console.log('clickApi'); }; </script>`

`混入 export default { onShow() { console.log(this.clickApi) }, }`

操作步骤：

组件index中创建clickApi 方法，使用全局混入，然后再混入onShow中打印this.clickApi 输出为undefined

预期结果：

输出clickApi 方法

实际结果：

输出undefined

bug描述：

2 个回复

公告

相关问题

【报Bug】微信小程序 VUE3 setup语法糖使用混入后，拿不到组件内的属性。

示例代码： 组件Index <template> <button @click="clickApi">clickApi</button> </template> <script setup name="demo-index"> const clickApi = () => { console.log('clickApi'); }; </script> 混入 export default { onShow() { console.log(this.clickApi) }, }

操作步骤： 组件index中创建clickApi 方法，使用全局混入，然后再混入onShow中打印this.clickApi 输出为undefined

预期结果： 输出clickApi 方法

实际结果： 输出undefined

bug描述：

与内容相关的链接

2 个回复

公告

相关问题

示例代码：

`组件Index <template> <button @click="clickApi">clickApi</button> </template> <script setup name="demo-index"> const clickApi = () => { console.log('clickApi'); }; </script>`

`混入 export default { onShow() { console.log(this.clickApi) }, }`

操作步骤：

组件index中创建clickApi 方法，使用全局混入，然后再混入onShow中打印this.clickApi 输出为undefined

预期结果：

输出clickApi 方法

实际结果：

输出undefined