<template>
<view class="content">
<image class="logo" src="/static/logo.png"></image>
<view class="text-area">
<text class="title">{{title}}</text>
</view>
</view>
</template>
<script setup>
import {
getCurrentInstance,
onMounted,
defineExpose,
ref
} from 'vue'
const instance = getCurrentInstance()
const title = 'ssssssffffffff'
const kkkkkkkk = ref('ppppppppppppppppxxxxxxxxxxxxxxxxx')
console.log(instance.proxy.title);
onMounted(() => {
console.log(instance);
})
// export default {
// data() {
// return {
// title: 'Hello'
// }
// },
// onLoad() {
// console.log(this);
// },
// methods: {
// }
// }
// defineExpose({
// title
// })
</script> 
1***@qq.com
- 发布：2024-01-27 14:48
- 更新：2024-01-27 16:55
- 阅读：343
产品分类： uniapp/App
PC开发环境操作系统： Windows
PC开发环境操作系统版本号： window 11
HBuilderX类型： 正式
HBuilderX版本号： 3.99
手机系统： Android
手机系统版本号： Android 9.0
手机厂商： 模拟器
手机机型： 雷电模拟器
页面类型： vue
vue版本： vue3
打包方式： 云端
项目创建方式： HBuilderX
示例代码：
操作步骤：
<template>
<view class="content">
<image class="logo" src="/static/logo.png"></image>
<view class="text-area">
<text class="title">{{title}}</text>
</view>
</view>
</template>
<script setup>
import {
getCurrentInstance,
onMounted,
defineExpose,
ref
} from 'vue'
const instance = getCurrentInstance()
const title = 'ssssssffffffff'
const kkkkkkkk = ref('ppppppppppppppppxxxxxxxxxxxxxxxxx')
console.log(instance.proxy.title);
onMounted(() => {
console.log(instance);
})
// export default {
// data() {
// return {
// title: 'Hello'
// }
// },
// onLoad() {
// console.log(this);
// },
// methods: {
// }
// }
// defineExpose({
// title
// })
</script>
直接模拟器运行
<template>
<view class="content">
<image class="logo" src="/static/logo.png"></image>
<view class="text-area">
<text class="title">{{title}}</text>
</view>
</view>
</template>
<script setup>
import {
getCurrentInstance,
onMounted,
defineExpose,
ref
} from 'vue'
const instance = getCurrentInstance()
const title = 'ssssssffffffff'
const kkkkkkkk = ref('ppppppppppppppppxxxxxxxxxxxxxxxxx')
console.log(instance.proxy.title);
onMounted(() => {
console.log(instance);
})
// export default {
// data() {
// return {
// title: 'Hello'
// }
// },
// onLoad() {
// console.log(this);
// },
// methods: {
// }
// }
// defineExpose({
// title
// })
</script> 直接模拟器运行
预期结果：
能访问到当前组件实例对象上的已声明的变量
能访问到当前组件实例对象上的已声明的变量
实际结果：
访问不到
访问不到
bug描述：
uniapp app模式下vue3 <script setup>语法糖写法下通过getCurrentInstance.proxy获取当前实例访问不到声明的变量，普通export default {}方式写法去访问this上的属性却可以访问到
1***@qq.com (作者)
抱歉，我没打完整，应该是这样通过当前实例去获取getCurrentInstance().proxy，我在vue3里试了可以访问到，没事也是个小问题，反应一下，帮助完善
2024-01-29 09:11
JXWang
回复 1***@qq.com: 请问您是如何在vue3里边可以访问到的，我是这样写的访问不到 <script setup>
import {
getCurrentInstance,
onMounted,
ref
} from 'vue'
const instance = getCurrentInstance()
const title = ref('test')
onMounted(() => {
console.log('title', instance.proxy.title);
})
</script>
2024-01-29 10:41