鍍金池/ 問答/HTML/ iview table column中renderHeader是如何是實現(xiàn)傳 h

iview table column中renderHeader是如何是實現(xiàn)傳 h 進來的

iview table column中renderHeader是如何是實現(xiàn)傳 h 進來的 ?

查看的table-head.vue 中調(diào)用 column的 renderHeader的方法,只傳了兩個參數(shù) column、 $index, 可是為什么在iview提供的文檔中確變成了不一樣的參數(shù) ( 第一個是 h,第二個為對象,包含 column 和 index,分別為當前列數(shù)據(jù)和當前列索引。)

求解

clipboard.png

clipboard.png

clipboard.png

回答
編輯回答
葬憶

vue 調(diào)用render 時候,傳進來的,有些事情是框架做了
下面這樣是不是好理解一點

class App {
  render(h,arg){
    h(arg.a,arg.b)
  }
}

const add= (a,b)=>{
  console.log(a+b)
}

let app = new App()
app.render(add,{
  a:1,
  b:2
})

從來沒有用過iView 我看了一下iView文檔,iView 的table 提供了兩個自定義函數(shù),一個render() 一個renderheader()
其中
render() 是用來自定義表格中列表項的自定義顯示
renderheader() 是用來自定義表格中表頭的自定義顯示

圖片描述

這里的圖標是render() 加上去的代碼如下

render: (h, params) => {
                            return h('div', [
                                h('Icon', {
                                    props: {
                                        type: 'person'
                                    }
                                }),
                                h('strong', params.row.name)
                            ]);
                        },

圖片描述

這里兩個圖標是通過renderheader()加上去的

renderHeader:(h, params) => {
                            return h('div', [
                                h('Icon', {
                                    props: {
                                        type: 'alert'
                                    }
                                }),
                                h('strong', params.column.title)
                            ]);
                        },

完整代碼:https://jsfiddle.net/papersna...

至于為什么你看iView的源碼看不到 h傳入過程

因為你看錯了,這是master分支的代碼,但你看的是2.0的文檔

2017年3月20日 14:03
編輯回答
初心

查看iview table .vue 源碼,查看到了iview對此進行了封裝。

2017年8月30日 00:41