uni-app x中,使用hooks的写法在web上正常,但在安卓底座上运行时无效

uni-app x中,使用hooks的写法在web上正常,但在安卓底座上运行时无效

开发环境 版本号 项目创建方式
Windows 10 HBuilderX

bug描述:

如题,这样的hooks用法在web上正常,但在安卓底座上运行时无效。 uni-app x中uvue对vue3中的hooks特性支持有BUG。

示例代码:

// pages/index/index.uvue ,<script setup>标签下这么写  
import useCommonTool from '@/hooks/useCommonTool.uts'  
const {goto} = useCommonTool()  

// pages/index/index.uvue ,<template>标签下这么写  
<button  [@click](/user/click)="goto('/pages/map/index')">查看地图示例</button>  

// 相关的 /hooks/useCommonTool.uts 文件里这么写  
export default function useCommonTool() {  
    const goto = (url:string) => {  
      uni.navigateTo({url:url})  
    }  

    return {  
        // methods  
        goto,    
    }  
}

操作步骤:

HbuilderX中,运行 -> 运行到手机或模拟器 -> 运行到Android App底座

预期结果:

正常编译,并在手机上正常运行起来。

实际结果:

编译时,服务运行日志报错:

10:29:21.525 [plugin:uni:app-uts] 编译失败  
10:29:21.525 error: Unresolved reference: goto  
10:29:21.525 at pages/index/index.uvue:20:7  
10:29:21.525 18 |    
10:29:21.525 19 |  // methods  
10:29:21.525 20 |  const {goto} = useCommonTool()  
10:29:21.525    |         ^  
10:29:21.525 21 |  // const goto = (url:string) => {  
10:29:21.525 22 |  //  uni.navigateTo({url:url})  
10:29:21.526 error: Not enough information to infer type variable T  
10:29:21.526 at pages/index/index.uvue:8:111  
10:29:21.526 6  |    </view>  
10:29:21.526 7  |    <view>  
10:29:21.526 8  |     <button :disabled="true" class="uni-button-primary uni-radius-pill" [@click](/user/click)="goto('/pages/map/index')">查看地图示例</button>  
10:29:21.526    |                                                                                                                 ^  
10:29:21.526 9  |    </view>  
10:29:21.526 10 |   </view> 

更多关于uni-app x中,使用hooks的写法在web上正常,但在安卓底座上运行时无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app x中,使用hooks的写法在web上正常,但在安卓底座上运行时无效的实战教程也可以访问 https://www.itying.com/category-93-b0.html


这是由于uni-app x在Android底座环境下对UTS模块的解构语法支持不完全导致的。建议改用以下写法:

<script setup>
import useCommonTool from '@/hooks/useCommonTool.uts'
const commonTool = useCommonTool()

function handleClick() {
  commonTool.goto('/pages/map/index')
}
</script>

<template>
  <button [@click](/user/click)="handleClick">查看地图示例</button>
</template>
回到顶部