Vue渲染函数详解(4)

对于这个组件，children 会给两个段落标签，而 slots().default 只会传递第二个匿名段落标签，slots().foo 会传递第一个具名段落标签。同时拥有 children 和 slots() ，因此可以选择让组件通过 slot() 系统分发或者简单的通过 children 接收，让其他组件去处理

模板编译

Vue 的模板实际是编译成了 render 函数。这是一个实现细节，通常不需要关心。下面是一个使用 Vue.compile 来实时编译模板字符串的简单 demo：

<my-functional-component> <p slot="foo"> first </p> <p>second</p> </my-functional-component>

render:

function anonymous( ) { with(this){return _c('div',[_m(0),(message)?_c('p',[_v(_s(message))]):_c('p',[_v("No message.")])])} }

staticRenderFns:

_m(0): function anonymous( ) { with(this){return _c('header',[_c('h1',[_v("I'm a template!")])])} }

以上这篇Vue渲染函数详解就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。