安裝:
npm i mint-ui -S
關(guān)于事件綁定
在 Vue 2.0 中破讨,為自定義組件綁定原生事件必須使用 .native 修飾符:
<my-component @click.native="handleClick">Click Me</my-component>
從易用性的角度出發(fā),我們對 Button 組件進行了處理宵距,使它可以監(jiān)聽 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 }
})