Vue组件库Mint UI

安装:

npm i mint-ui -S

关于事件绑定
在 Vue 2.0 中,为自定义组件绑定原生事件必须使用 .native 修饰符:

Click Me

从易用性的角度出发,我们对 Button 组件进行了处理,使它可以监听 click 事件:

Click Me

但是对于其他组件,还是需要添加 .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 }
})

你可能感兴趣的