functional: true,
props: {}, // 暂时没有需求需要,随着需求扩展可以在此定义通过html分割
render: (h, context) => {
const { children, slots } = context
const defaultSlot = slots.default ? slots.default() : []
const vNode = []
const validNode = children.filter((a) => a.tag !== undefined && a.tag !== null)
if (validNode.length > 0) {
for (let index = 0; index < validNode.length; index++) {
const ele = validNode[index]
vNode.push(ele)
if (index < validNode.length - 1) {
vNode.push(h('span', { class: ['sh_divide'] }))
}
}
}
vNode.push(...defaultSlot)
const container = h('div', { class: ['sh_space'] }, vNode)
return container
Vue render 函数
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
推荐阅读更多精彩内容
- 前几天想学学Vue中怎么编写可复用的组件,提到要对Vue的render函数有所了解。可仔细一想,对于Vue的ren...
- 写在开头 终极解决方法,直接看文章 解决循环跳转页面不刷新[#3] 部分 浏览器前进刷新后退不刷新 这一部分用来...