element-ui坑點

element-UI坑點

1、el-popconfirm 氣泡確認框

-1 設定確認按鈕的文字 confirmButtonText = “…” 是無效的

需要避免駝峰命名法 , 換成 confirm-button-text 才可以設定成功

同理 cancelButtonText 需要換成=>cancel-button-text

-2 用來觸發 Popconfirm 顯示的 HTML標籤上 需要設定 slot="reference"

否則會隱藏顯示

-3 官方文件中 Events 裡的 onConfirm 和 onCancel 事件

目前無法繫結方法,或者無法觸發方法，如:

@onConfirm=“click()”

切換大小寫或者避免駝峰命名法都已經嘗試,都無效

2 如何修改 el-table 的邊框顏色

                .el-table td,
                .el-table th.is-leaf,
                .el-table--border,
                .el-table--group {
                    border-color: black;
                }

                .el-table--border::after,
                .el-table--group::after,
                .el-table::before {
                    background-color: black;
                }

3 el-select value值

el-select的 el-option 選項不可設定value為物件，雖然可以點選可以更改對應的值，但select控制元件無法分辨選中了哪一個選項

<el-select v-model="editingInst.templateId" placeholder="請選擇模板" @change='selectC'>
       <el-option v-for="item in tempList" 
                  :key="item.id" :label="item.name"
                   :value="item">
           item為陣列內的物件,若設定option的value為物件,select控制元件無法分辨,會顯示選中所有的選項
       </el-option>
</el-select>