vue.js render

本文详细解释了Vue.js中render函数的作用及其实现DOM渲染的过程。通过对比不同写法,阐述了如何使用createElement别名h来创建虚拟节点,并将其挂载到指定元素上。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

new Vue({
  el: '#app',
 
 render: h => h(App ) 
})
/render 是vue里面实现渲染dom的函数,这句的目的是渲染这个app实例。
                      //用App这个模板。相当于compoments:{App},使用app这个组件


render函数是渲染一个视图,然后提供给el挂载,如果你没有加那么就等于没有视图给el挂载,自然什么都没有了。
另外




{
    render: h => h(App)
}
等价于




{
    render: h => {
        return h(App)
    }
}
其实只是简写的方式。
如果不涉及使用this的话下面这个也是等价的




{
    render: function (h) {
        return h(App)
    }
}
将 h 作为 createElement 的别名是 Vue 生态系统中的一个通用惯例,实际上也是 JSX 所要求的,如果在作用域中 h 失去作用, 在应用中会触发报错。
render: h => h(App)
你可以将上述代码看做为




render: function (createElement){
    return createElement(app);
}
可见,在vuejs中,h函数仅是作为createElement函数之缩写
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值