在Vue3.0中定义vant的toast全部提示
以定义一个全局toast为例。
可以换一个思路,怎么在vue3中使用prototype.
挂载全局变量
在vue2中:
import { Toast } from vant import Vue from vue Vue.prototype.$toast=Toast;
在vue3中通过 app.config.globalProperties进行挂载:
import { createApp } from vue import { Toast } from vant const app = createApp(App); app.config.globalProperties.$toast = Toast; const vm = app.mount(#app)
引用全局变量
在vue2中使用this.$toast即可使用。
在vue3中:
在vue3.0中新增了组合式api setup,setup在钩子函数前执行,此时vue对象还没有this,所以可以使用getCurrentInstance代替this,使用如下:
import { getCurrentInstance } from vue setup() { const { proxy } = getCurrentInstance() onMounted(() => { proxy.$toast({message: 开启失败,请稍后再试,})//这里的proxy代替this }) return { } }