Vue源码之render函数（四）

在$mount函数中，最后调用的updateComponent函数，该函数中的调用了实例的私有函数vm._render，因此，现在需要弄清楚vm._render函数完成了什么功能。

在'src/core/instance/render.js'中，在Vue的原型上定义了私有_render函数。

1. 首先从vm.$options中拿到render函数，先暂时忽略其他部分代码，然后通过调用render函数获得vnode。

2. 可以看到，在调用render 函数时，传入了两个参数，首先是上下文renderProxy，然后是参数$createElement。

其中的$createElement是一个函数，返回的是一个vnode。它被定义在手写render函数的情况下，vm._c被定义的是通过template编译的情况下调用。

3. _renderProxy在‘./init.js’中定义，在开发环境中，调用initProxy函数。

4. initProxy函数在'proxy.js'中被定义。es6中，Proxy的用途是对于new Proxy(target, handlers)中的target对象都进行劫持，也就是使用handlers进行处理。

在这里，handlers对应的处理是hasHandlers，hasHandler的作用是首先判断实例中已经定义该属性，然后再判断属性的格式是否与api名字重复以及是否是以下划线命名'_'（这两种情况是不符合要求的）。如果符合这两种情况，则Vue会抛出警告。

5. 再回到render函数，'src/core/instance/render.js'中，如果vnode不是Vnode的实例，且是一个数组，则Vue会抛出一个警告。

总结

_render函数主要是通过调用vm.$options.render函数，并返回一个vnode。vm.$options中的render函数主要是调用了$createElement函数，这个函数会返回一个node。同时，在调用render函数时，还会经过proxy代理检查属性是否满足要求。