這是官網關于createElement的簡單例子
// @returns {VNode}
createElement(
// {String（一個 HTML 標簽字符串） | Object（組件選項對象） | Function（一個返回值類型為String/Object的函數）}
// 必要參數
'div',
// {Object（包含模板相關屬性的數據對象 ）}
// 這樣，您可以在 template 中使用這些屬性.可選參數.
{
// {String | Array}
// 子節點 (VNodes)，由 `createElement()` 構建而成，
// 或簡單的使用字符串來生成“文本結點”。可選參數。
},
[ '先寫一些文字', createElement('h1', '一則頭條'),
createElement(MyComponent, {
props: { someProp: 'foobar' }
})
])
從例子中可以看到，createElement方法是可以嵌套的
實際例子中甚至可以實現多層嵌套，特別注意??這里加屬性的時候要加載props里面
<template>
<el-table :data="tableData">
<el-table-column prop="num" :render-header="renderHeader">
</el-table-column>
</el-table>
</template>
<script>
data() {
return {
tableData: [{ num: '50' }] }
},
methods: {
/** 加表頭提示
* @param {Function} creatElement 函數
* @return {object} 返回的虛擬dom
*/
renderHeader(createElement, { column }) {
return creatElement('div', [
'可用庫存',
creatElement('el-tooltip', {
class: 'item',
props: {
content: '可用庫存=總庫存-銷售庫存',
placement: 'top',
},
}, [
creatElement('i', {
class: 'we-icon we-icon--icon-help',
style: 'color: #666; font-size: 13px;margin-left: 8px;',
}),
]),
])
} }
</script>
