4回答

donggua_nor

2021-08-20

子组件构造函数是走 Vue.extend 实现的

位于 vdom/create-component.js => createComponent 中 Ctor = baseCtor.extend(Ctor)

如果在vue中使用过typeScript，也会显式使用 Vue extend，该函数位于 global-api/extend.js

在 Vue.extend 中继承了 Vue.prototype._init 方法(位于 instance/init.js )，但没有执行。当前 Sub 是个构造函数

在这里检查组件computed，并在组件原型 `Sub.prototype` 上定义计算属性

当后续实例化组件Sub时，才会走到 defineComputed 
这时原型上已经有了，我们可以通过原型链读取到对应的computed key，就不会重复执行

简单将注释翻译如下: （位于 instance/state.js ）

0

0

开心阿桶暮

2021-08-19

这个地方的 !(key in vm) 是判断是否和当前实例属性的其他变量名(例如data中和computed中声明了同样的变量名)冲突的，所以开发时只要写的正确，必定进入difineComputed的，所以你问题里说的 key就不会继续执行defineComputed方法,  只有你写错了，才不会继续执行，正常就是往defineComputed这里面走的

0

1

菜菜木子

谢谢你的解答，但是好像不太正确，建议再多看看源码

2021-08-19

共1条回复

ustbhuangyi

2021-08-16

在 global-api/extend.js 中，在执行 extend API 创建子组件构造器的时候，会执行 initComputed 函数，它会在组件原型上义。

0

4

菜菜木子

回复

ustbhuangyi

查到资料了，我懂了，谢谢老师

2021-08-16

共4条回复

ustbhuangyi

2021-08-16

initState -> initComputed -> defineComputed 
defineComputed 的最后，执行 Object.defineProperty 

0

1

菜菜木子

在initState->initComputed中判断如果实例上有key就不会继续执行defineComputed方法的，不解？（老师，回复不能贴图，问答有修改）

2021-08-16

共1条回复