Mint UI 使用采坑记

1. 地址：

官网地址

2. 坑1：vue2.0中我在main.js中导入了MintUI，但是在子组件中我在使用Toast的时候，提示我Toast未定义， 不仅Toast 还有 Indicator Messagebox 等等

在min.js中代码：

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import MintUI from 'mint-ui'
import 'mint-ui/lib/style.css'
Vue.config.productionTip = false
Vue.use(MintUI)
new Vue({
  router,
  render: h => h(App),
}).$mount('#app')
复制代码

解决办法：

• 1.在组件中再次引入要用的

import { Toast } from 'mint-ui'
复制代码

• 2. 通过vm.$toast 调用 查看MintUi源码index.js发现

 Vue.$messagebox = Vue.prototype.$messagebox = MessageBox;
 Vue.$toast = Vue.prototype.$toast = Toast;
 Vue.$indicator = Vue.prototype.$indicator = Indicator;
复制代码

所以在调用的时候可以

handleSubmit () {
  this.$toast(data.retMsg)
}
复制代码

转载于:https://juejin.im/post/5d099785f265da1b80204926