render ) ，比如如下模板：
<div>
<h2 slot="slot1">BaseComponent slot</h2>
</div>会被编译成如下渲染函数：
var render = function() { var _vm = this var _h = _vm.$createElement var _c = _vm._self._c || _h return _c("div", [ _c("h2", { attrs: { slot: "slot1" }, slot: "slot1" }, [ _vm._v("BaseComponent slot") ]) ])}想要查看一个组件的模板被编译后的渲染函数很简单，只需要在访问
this.$options.render 即可。观察上面的渲染函数我们发现普通的
DOM 是通过
_c 函数创建对应的
VNode 的。现在我们修改模板，模板中除了有普通
DOM 之外，还有组件，如下：
var render = function() {
var _vm = this
var _h = _vm.$createElement
var _c = _vm._self._c || _h
return _c("div", [
_c("h2", {
attrs: { slot: "slot1" },
slot: "slot1"
}, [
_vm._v("BaseComponent slot")
])
])
}那么生成的渲染函数(
render )是这样的：
<div>
<base-component>
<h2 slot="slot1">BaseComponent slot</h2>
<p>default slot</p>
</base-component>
</div>我们发现无论是普通DOM还是组件，都是通过
_c 函数创建其对应的
VNode 的。其实
_c 在
Vue 内部就是
createElement 函数。
createElement 函数会自动检测第一个参数是不是普通DOM标签，如果不是普通DOM标签那么
createElement 会将其视为组件，并且创建组件实例， 注意组件实例是这个时候才创建的 。但是创建组件实例的过程中就面临一个问题： 组件需要知道父级模板中是否传递了
slot 以及传递了多少，传递的是具名的还是不具名的等等 。那么子组件如何才能得知这些信息呢？很简单，假如组件的模板如下：
var render = function() {
var _vm = this
var _h = _vm.$createElement
var _c = _vm._self._c || _h
return _c(
"div",
[
_c("base-component", [
