vue3中组件为何不能使用this呢？

Question

我有一个Main.vue组件：

<script setup>

const init = () => {

  console.log(this)  // 打印出来是undefined
  ...
}

init()
</script>
...

vue3中组件为何不能使用this呢？

Answer 1

vue3 组合式api中不支持对组件实例的访问，只能在 options api 中访问 this。

• 形如一些挂载到 app.config.globalProperties 上的全局属性或公共方法，通过 ESM 模块化管理更合适，在需要使用的地方 import 即可，不需要依赖 vue 的组件实例

Answer 2

别用组合式API的破语法就是了，跟2一样写

Answer 3

vue3的setup中可以使用getCurrentInstance()来获取当前实例
app.config.globalProperties.$fs = fsjs
这种方式不推荐，没有了tree shaking优化