请稍等 ...
×

采纳答案成功!

向帮助你的同学说点啥吧!感谢那些助人为乐的人

App中引入HelloWorld子组件, 在HelloWorld中$parent为什么指向了App, 而不是HelloWorld的占位符实例

App中引入HelloWorld子组件, 在HelloWorld中$parent为什么指向了App, 而不是HelloWorld的占位符实例。是HelloWorld跳过了占位符vnode直接生成了渲染vnode么

// core/instance/lifecycle.js
export function initLifecycle (vm: Component) {
  const options = vm.$options
  let parent = options.parent
  vm.$parent = parent
}
  1. 将app经过render生成占位节点挂载, vm是Vue实例, vm.parent是undefined
  • new Vue({render: h => h(App)}).$mount('#app') vm是new Vue
  • init-> initLifecycle() {vm.$parent = parent} vm.parent是undefined
  • render(生成占位符vnode)
  • update(vnode/*占位节点*/, hydrating), 设置activeInstance为vm
  • patch (oldVnode /*div #app*/, vnode /*占位符vnode*/, hydrating, removeOnly) -
  • createComponent(vnode, insertedVnodeQueue, parentElm, refElm), 调用init, 生成componentInstance
  1. 为app占位节点生成componentInstance, vm是child, vm.parent是上次激活的Vue实例, 接着走_init$mount

是否代表组件渲染成真实的dom, 需要走俩次mount,一次是挂载占位节点,一次是挂载渲染节点

在我设想中, 应该有4次mount即4次_update:App的占位节点和渲染节点以及HelloWorld的占位节点和渲染节点。debbuger时只调用了3次mount。我猜测是只有createComponentInstance才会走mount, 一次初始化+2次createComponentInstance故而三次, 占位节点不会走mount。但是这样的话$parent也还是HelloWorld的占位节点呀。我看断点好像是HelloWorld跳过了占位节点,直接生成了渲染节点

正在回答 回答被采纳积分+3

插入代码

1回答

提问者 慕先生4328837 2022-06-13 19:56:27

是生成HelloWorld占位节点时,vm仍是appComponentInstance么, 或者父子组件中做了什么操作, 或者让把占位符vnode的一些属性赋值给了渲染vnode么

0 回复 有任何疑惑可以回复我~
  • 参考这个类似的回答 https://coding.imooc.com/learn/questiondetail/RQyZ06gV1JGXe459.html
    回复 有任何疑惑可以回复我~ 2022-06-16 14:08:30
问题已解决,确定采纳
还有疑问,暂不采纳
意见反馈 帮助中心 APP下载
官方微信