ElementUi自定義的header

表頭顯示倆行文字(單個)(見圖片)

	// template
    <el-table-column prop="test" :render-header="renderHeader"></el-table-column>
  
    // methods
    renderHeader(h) {
      return [
        h("p", {}, ["標題"]),
        h(
          "p",
          {
            style: "font-size:10px"
          },
          ["這是單位"]
        )
      ];
    },

表頭顯示倆行文字(多個)(見圖片)

可以一個methods完成，也可以寫多個methods

		// template
      	<el-table-column prop="test1" label="標題1這是單位1" :render-header="renderHeader"></el-table-column>
        <el-table-column prop="test2" label="標題2這是單位2" :render-header="renderHeader"></el-table-column>
        <el-table-column prop="test3" label="標題3這是單位3"  :render-header="renderHeader"></el-table-column>
		
		// 定義一個全局變量
		var renderHeaderList = [
		  {
		    title: "標題1",
		    key: "test1",
		    unit: "這是單位1"
		  },
		  {
		    title: "標題2",
		    key: "test2",
		    unit: "這是單位2"
		  },
		  {
		    title: "標題3",
		    key: "test3",
		    unit: "這是單位3"
		  }
		];
		// methods
		// column.property 是props的key值
		renderHeader(h, { column, $index }) {
	      let obj = renderHeaderList.find(item => item.key == column.property);
	      return [
	        h("p", {}, [`${obj.title}`]),
	        h("p", { style: "font-size:10px" }, [`${obj.unit}`])
	      ];
	    },