前言：
在我們的vue專案中可供引入的框架是很多的，這里分享下在vue中使用element-ui的框架
element-ui官網入口
實作步驟：
一、引入element-ui
方法1：安裝node包
cnpm i element-ui --save方法2：cdn引入
<!-- 引入樣式 -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<!-- 引入組件庫 -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>二、main.js中注冊（如果上面使用的是cdn引入則沒有這一步）
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);三、到這一步element-ui應該配置的檔案我們都引入成功了，下來該使用了
1、打開官網地址，參照下面的4個小步驟可以拿到想要的效果和代碼
2、實際練習，以 el-button 按鈕作案例，找到Button，然后找到基礎用法，點擊粉色圈，打開源代碼
3、拿到源代碼以后在頁面上試一試
在 a.vue（案例檔案）中引入 element的button
<template>
<div>
內容區域
<el-button type="danger" plain>危險按鈕</el-button>
</div>
</template>4、到這一步，就可以到頁面上看你寫的效果了，教程到此結束了！
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/256390.html
標籤：其他
上一篇：HTML 5 詳解之鏈接標簽