Vue是一種用于構建用戶界面的漸進式框架,由前端工程師Evan You在2014年創建。與傳統的大型框架不同,Vue的核心庫只關注視圖層,可輕松與第三方庫或既有項目整合。因此Vue具有相對較小、靈活、高效等特點,成為前端開發的熱門選擇。
Element是一套基于Vue的組件庫,提供了各種常用的UI組件,如按鈕、表格、彈窗等,可以快速搭建出好看、易用的前端界面。Element組件庫的特點是簡潔、美觀、易用、國際化等,多語言支持和易于定制皮膚是其最重要的特點,支持25種語言。
//在Vue項目中引入Element
import Vue from 'vue';
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);
引入Element后,我們就可以使用其中提供的各種組件了。比如,我們想在頁面上添加一個按鈕,并在點擊按鈕時觸發一個事件,可以這樣寫:
<template>
<div>
<el-button @click="handleClick">點擊我</el-button>
</div>
</template>
<script>
export default {
methods: {
handleClick () {
console.log('你點我了');
}
}
}
</script>
如上代碼,我們使用了Element提供的el-button組件,并在它上面綁定了一個點擊事件。當我們點擊這個按鈕時,控制臺會輸出一段文字。這就是使用Element組件庫的過程,簡單快捷。
上一篇零基礎如何學css
下一篇elfinder vue