vue3挂载全局方法
vue2.x的全局挂载方法为如何所示:import Vue from "vue";import Echarts from "echarts";Vue.prototype.$echarts = Echarts;new Vue({router,store,render: (h) => h(App),}).$mount("#app");使用的时候如下this.$echarts.xxx()vue3.
·
vue2.x的全局挂载方法为如何所示:
import Vue from "vue";
import Echarts from "echarts";
Vue.prototype.$echarts = Echarts;
new Vue({
router,
store,
render: (h) => h(App),
}).$mount("#app");
使用的时候如下
this.$echarts.xxx()
vue3.0全局挂载方法
以Ant Design Vue中的message为例:
在main.ts中代码如何
import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import Antd, { message } from 'ant-design-vue';
import 'ant-design-vue/dist/antd.css';
const app = createApp(App);
app.config.globalProperties.$message = message;
app.use(store)
.use(router)
.use(Antd)
app.mount('#app');
由app.config.globalProperties.$message = message;进行挂载
在页面中使用如下所示:
在js中引入
import { reactive, getCurrentInstance } from 'vue';
在用的地方使用
setup() {
const { ctx } = getCurrentInstance();
const login= () => {
ctx.$message.info('登录成功')
};
return {
login
}
}
更多推荐
已为社区贡献2条内容
所有评论(0)