el-table 自定義表頭 使用方法 :render-header

因爲維護了element ui 1.3.7 版的項目，要自定義表頭和提示使用 :render-header

效果：

代碼：

<template>
    <div class="promptMessage">
        <el-tooltip effect="dark" placement="bottom">
            <div slot="content">
            <p v-for="item in messages" :key="item">
                {{item}}
            </p>
            </div>
            <i class="el-icon-information" style="color:#409eff;margin-left:5px;font-size:15px;"></i>
        </el-tooltip>
    </div>
</template>

<script>
// 自定義表頭提示用法
// import promptMessage from 'components/common/promptMessage'
// Vue.component('promptMessage', promptMessage)
// <el-table-column prop="orderNo" label="示例" :render-header="renderHeader">
// </el-table-column>
// renderHeader (h,{column}) {
//     return h(
//     'div',{
//         style:'display:flex;margin:auto;'
//     },
//     [
//         h('span', column.label),
//         h('prompt-message', {
//         props: {messages: ["提示信息"]}
//         })
//     ]
//     );
// },
export default {
    props: {
        messages: {
            type: Array,
            default: ['暫無'],
        }
    }
};
</script>