第一步 安裝
npm i element-ui -S
第二部 在main.js中引入樣式
//main.js
import 'element-ui/lib/theme-chalk/index.css';
第三步 安裝
npm install babel-plugin-component -D
第四步 看情況煌妈,是否在全局引入(比如一些很多模塊都要用到的Button,可在main.js中全局引入)
import Vue from 'vue';
import { Button, Select } from 'element-ui';
import App from './App.vue';
Vue.component(Button.name, Button);
Vue.component(Select.name, Select);
/* 或?qū)憺?* Vue.use(Button)
* Vue.use(Select)
*/
new Vue({
el: '#app',
render: h => h(App)
});
有的組件在項(xiàng)目中只要用到一次微服,那只需在要用到此組件的模塊中單獨(dú)引入
//xxx.vue
<template>
<div>
<el-button type="success">成功按鈕</el-button>
<el-transfer v-model="value" :data="data"></el-transfer>
</div>
</template>
<script>
import { Button, Transfer } from 'element-ui';
export default {
data() {
return {};
},
created() {
},
methods: {
},
components:{
[Button.name]:Button,
[Transfer.name]:Transfer
}
};
</script>