- 发布：2022-08-09 11:04
- 更新：2024-09-05 17:45
- 阅读：4574
vue3 script setup 语法糖中如何使用globalData全局变量
vue3 这样调用生命周期函数
<script setup>
import { onLaunch } from '@dcloudio/uni-app'
onLaunch(() => {
getApp().globalData.obj = { a: 1 }
console.log(getApp().globalData);
})
</script>getApp().globalData
-
1***@qq.com (作者)
如何定义呢
vue2 <script>export default { globalData: {xxxx} }</script>
vue3<script setup>..如何定义..</script>2022-08-09 14:25
<script setup lang="ts">
getApp().globalData = {
appVersion: appVersion
}
</script>这样写了，在微信小程序中还是报错
vendor.js? [sm]:2829 TypeError: Cannot read property 'globalData' of undefined
at app.js? [sm]:22
需要这样写：
<script lang="ts">
const appVersion = 110
// 微信中，只有通过这种方式申明才能使用全局变量。
export default {
globalData: {
appVersion: appVersion
}
}
</script>
<script setup lang="ts">
//xxx
</script>
l***@163.com - 识时务者为俊杰
下面这样写是可以的，官方文档说“在应用onLaunch时，getApp对象还未获取，暂时可以使用this.globalData获取globalData。”，所以这里可以通过 getCurrentInstance().proxy 来获取this。
https://uniapp.dcloud.net.cn/collocation/App.html
<script setup>
import { onLaunch } from '@dcloudio/uni-app'
import { getCurrentInstance } from 'vue';
const app = getCurrentInstance().proxy
onLaunch(() => {
app.globalData.obj = { a: 1}
})
</script><template>
<view>
<text>{{ text }}</text>
</view>
</template>
<script setup>
getApp().globalData.text = 'test text'
const { text } = getApp().globalData;
</script>globalData是简单的全局变量，如果使用状态管理，请使用vuex
-
-
-
-
-
回复 1***@qq.com: <script>
export default {
onLaunch: function() {
console.log('App Launch')
getApp().globalData.obj = { a: 1 }
console.log(getApp().globalData);
}
}
</script>2022-08-09 15:20
-
1***@qq.com (作者)
回复 CODE_XU: 在vue3 的 script setup语法糖中会报undefined 使用<script>export default { }</script>则没问题
2022-08-09 15:26
1***@qq.com (作者)
<script setup>
import {
ref,
reactive,
onMounted,
getCurrentInstance
} from 'vue'
import {
onLaunch
} from '@dcloudio/uni-app'
onLaunch(() => {
getApp().globalData.obj = {
a: 1
}
console.log(getApp().globalData);
})
</script>
TypeError: Cannot read property 'globalData' of undefined
at app.js? [sm]:48
at callWithErrorHandling (vendor.js? [sm]:2535)
at callWithAsyncErrorHandling (vendor.js? [sm]:2543)
at Array.hook.weh.hook.weh (vendor.js? [sm]:3145)
at invokeArrayFns (vendor.js? [sm]:199)
at Proxy.callHook (vendor.js? [sm]:5380)
at je.onLaunch (vendor.js? [sm]:5483)
at je.<anonymous> (WASubContext.js?t=wechat&s=1660007061615&v=2.25.2:1)
at new je (WASubContext.js?t=wechat&s=1660007061615&v=2.25.2:1)
at r.<anonymous> (WASubContext.js?t=wechat&s=1660007061615&v=2.25.2:1)(env: Windows,mp,1.06.2208010; lib: 2.25.2)
2022-08-09 15:43
1***@qq.com (作者)
您这样写 在微信小程序不会报错吗？
2022-08-09 15:45
CODE_XU
回复 1***@qq.com: 小程序确实发生了这个问题，暂且先调用 nextTick 在设置 globalData 吧
2022-08-09 16:01
1***@qq.com (作者)
回复 CODE_XU: OK 感谢您！
2022-08-09 16:08
1***@qq.com
回复 CODE_XU: 大佬，可以问一下vue3 nextTick 要怎么写吗
2023-11-29 12:37