安装:
npm i mint-ui -S
关于事件绑定
在 Vue 2.0 中,为自定义组件绑定原生事件必须使用 .native 修饰符:
<my-component @click.native="handleClick">Click Me</my-component>
从易用性的角度出发,我们对 Button 组件进行了处理,使它可以监听 click 事件:
<mt-button @click="handleButtonClick">Click Me</mt-button>
但是对于其他组件,还是需要添加 .native 修饰符。
- 按需引入
npm i mint-ui --save //安装Mint UI组件库
// 按需引入
npm i babel-plugin-component -D
//.babelrc配置
"presets" : 不用修改
"plugins": ["transform-runtime",["component",[
{"libraryName":"mint-ui","style":true}
]]],
"env": {
"test": {
"presets": ["env", "stage-2"],
"plugins": ["istanbul"]
}
}
//main.js 引入
import { Header } from 'mint-ui';
Vue.component(Header.name, Header);
- 完整引入
//main.js
import Vue from 'vue'
import MintUI from 'mint-ui'
import 'mint-ui/lib/style.css' //样式文件需要单独引入
import App from './App.vue'
Vue.use(MintUI)
new Vue({
el: '#app',
components: { App }
})