render函数和h函数

想了解render函数首先需要知道虚拟dom

Dom是文档对象模型的的简写,在浏览器中通过js来操作Dom性能很差,于是虚拟Dom应运而生。

虚拟Dom就是在js中模拟Dom对象树来优化Dom操作的一种技术或思路,它并不是真正意义上的Dom,它作为一个轻量级的js对象,在状态发生变化时,会进行Diff运算,来更新发生变化的Dom,对于未发生变化的Dom节点,不予操作,由于不是全部重绘,大大提高更新渲染性能。

使用render函数描述虚拟Dom时,vue提供了一个函数,这个函数是构建虚拟Dom所需要的工具,叫做createElement,约定的简写叫h

h函数(创建虚拟Dom)

h函数接收三个参数   

第一个参数(必选):

(可选类型)

string:html标签

Object:一个含有数据选项的对象

function:返回一个含有数据选项的对象

第二个参数(可选):

一个对象,标签的数据对应的数据

第三个参数:

子级虚拟节点,字符串形式或数组形式

render函数和h函数_第1张图片

然后使用render函数渲染虚拟Dom

render函数自动接收参数  (VNode、渲染的位置)

你可能感兴趣的:(vue.js)