uniapp 实现Toast轻提示!

一、在components 文件夹下新建Toast 文件, 包含Toast.vue 和index.js

Toast.vue




index.js

import Toast from "./Toast.vue";
let NewToast = {
	install: function(Vue) {
		//创建vue插件,官方地址https://cn.vuejs.org/v2/guide/plugins.html
		let newToast = Vue.extend(Toast); //创建vue构造器,官方地址https://cn.vuejs.org/v2/api/#Vue-extend
		let toast = new newToast(); //创建实例
		document.body.appendChild(toast.$mount().$el); //挂载
		Vue.prototype.$Toast = function(text) {
			toast.isshow = true; // 传入props
			toast.text = text; // 传入props
		};
	},
};
export {
	NewToast
};

二、在入口文件main.js文件中引入

import {
	NewToast
} from "@/components/Toast/index.js";

Vue.use(NewToast);

三、在页面中使用

this.$Toast("this is toast!");

你可能感兴趣的:(vue,+,uni-app,uni-app,vue.js,javascript)