
elMessage.js
javascriptimport {Message} from 'element-ui' const tipsEvent=(options)=>{ console.log(document.querySelectorAll('.el-message')); const dom=document.querySelectorAll('.el-message')[0] if(dom==undefined){ Message(options) } } const typeList=['success','error','info','warning'] typeList.forEach(item=>{ tipsEvent[item]=options=>{ const ele=document.querySelectorAll('.el-message')[0] if(ele==undefined){ Message[item](options) } } }) export const tips=tipsEvent
main.js中全局挂载
javascriptimport Vue from 'vue' import {tips} from '@/utils/elMessage.js' Vue.prototype.$message=tips;//在这里建议取相同的名称,因为是为了覆盖框架默认的this.$message
index.vue中使用
javascript<script> export default { name: 'index', methods: { handleTap(){ this.$message({ type:'warning', message:'警告提示触发了' }) } } } </script>
