1. 程式人生 > >iview+vue 使用中遇到的問題(表格、select、radio)

iview+vue 使用中遇到的問題(表格、select、radio)

數據 方式 center 遇到 自定義 情況 head time 沒有

1、iview+vue中,對表頭的動態設置:

  iview表頭若是需要動態設置,可以有兩個方法,第一種:

 children: [
            {
              title: 2017年,
              align: center,
              key: firstYear,
              renderHeader: (h, index) => {
                return h(div, {
                  domProps: {
                    innerHTML: 
this.data5.lastYear + } }); } }, {

  

  利用renderheader屬性來設置表頭。iview中的table自定義列頭顯示內容,使用 Vue 的 Render 函數。傳入兩個參數,第一個是 h,第二個為對象,包含 columnindex,分別為當前列數據和當前列索引。還有一種方式是在直接調用title更改:

this.columns4[2].children[0].title = this.timeYear.lastYear;

  但是這種方式可能會引起Vue的update無限循環警告。建議使用第一種方法。

2、iview+vue中,表單驗證select出錯:

  可能在使用iview表單的select時,發現代碼沒有書寫錯誤,但是驗證功能出現問題,這是因為iview默認類型與最終select的需要驗證的結果類型不一致。

3、iview+vue中,radio選擇問題:

  在iview的單選radio中,綁定選中狀態lable = “0”與獲取選中狀態status = 0 是不匹配的,應為“0”。

結論:在iview使用過程中,要註意默認類型問題,很容易出現接收類型與默認類型不一致的情況而導致出現錯誤。對與表格自定義列的問題,render自定義列內容,renderheader自定義列頭。

iview+vue 使用中遇到的問題(表格、select、radio)