1.前言
最近开发小程序，开发环境uni_app+vue3等。在获取小程序平台用户信息是报错：
{errMsg: "getUserProfile:fail must be invoked by user tap gesture", errNo: 21500}
我在抖音上查了下错误码：
看到这个解释也是瞬间无语了，然后在平台查找错误，找了半天终于在vue2 升级vue3文档里面找到解决办法,官方链接：
uni-app官网 (dcloud.io)https://zh.uniapp.dcloud.io/tutorial/migration-to-vue3.html#some-miniapp-terminal-events-of-vue3-project-are-delayed-or-failed-to-call
这里也给出了解释。
2.代码逻辑
<template>
<view class="page">
<view class="box" data-eventsync="true" @click="getUserProfile">
<text class="head">头像</text>
<text>获取用户信息</text>
</view>
<button data-eventsync="true" @click="getUserProfile">获取用户信息</button>
</view>
</template>
<script setup lang="ts">
const getUserProfile = async () => {
await new Promise(() => {
uni.getUserProfile({
success: (res) => {
console.log('success', res);
}, fail: (err) => {
console.log('err', err);
uni.showModal({
title: '提示',
content: JSON.stringify(err),
success: function (res) {
if (res.confirm) {
} else if (res.cancel) {
}
}
});
}
})
})
}
</script>注意点：一定要把data-eventsync="true"添加到事件源上，冒泡到父节点不会生效，如下图所示，在外层view添加了点击事件，我点击了子元素，也会报错，所以子结点上也要添加data-eventsync="true"。
完整代码文章来源：https://www.toymoban.com/news/detail-765308.html
<template>
<view class="page">
<view class="box" data-eventsync="true" @click="getUserProfile">
<text class="head" data-eventsync="true">头像</text>
<text data-eventsync="true">获取用户信息</text>
</view>
<button data-eventsync="true" @click="getUserProfile">获取用户信息</button>
</view>
</template>
<script setup lang="ts">
const getUserProfile = async () => {
await new Promise(() => {
uni.getUserProfile({
success: (res) => {
console.log('success', res);
}, fail: (err) => {
console.log('err', err);
uni.showModal({
title: '提示',
content: JSON.stringify(err),
success: function (res) {
if (res.confirm) {
} else if (res.cancel) {
}
}
});
}
})
})
}
</script>
以上是uni_app加vue3开发遇到的问题，希望对你有所帮助。vue2开发小程序不会存在这个问题。文章来源地址https://www.toymoban.com/news/detail-765308.html
到了这里，关于uni_app+vite+vue3+ts开发小程序，解决getUserProfile()获取用户信息问题的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
