Element學習

Look_Back發表於2024-11-21

在 Java Web 開發中，前端框架和元件庫的選擇對於構建使用者介面至關重要。“Element（餓了麼）” 是一個非常流行的前端元件庫，特別適用於構建基於 Vue.js 的應用程式。

在你的 Vue 元件中，可以直接使用 Element 提供的元件：

  1. 常用元件示例
    4.1 按鈕 (Button)
<el-button type="primary">主要按鈕</el-button>
<el-button type="success">成功按鈕</el-button>
<el-button type="warning">警告按鈕</el-button>
<el-button type="danger">危險按鈕</el-button>

4.2 輸入框 (Input)

<el-input v-model="input" placeholder="請輸入內容"></el-input>

4.3 表格 (Table)

<el-table :data="tableData">
  <el-table-column prop="date" label="日期" width="180"></el-table-column>
  <el-table-column prop="name" label="姓名" width="180"></el-table-column>
  <el-table-column prop="address" label="地址"></el-table-column>
</el-table>

4.4 對話方塊 (Dialog)

<el-dialog title="提示" :visible.sync="dialogVisible">
  這是一段資訊
</el-dialog>

相關文章