【Vue原理】Props - 源码版

写文章不容易，点个赞呗兄弟
专注 Vue 源码分享，文章分为白话版和 源码版，白话版助于理解工作原理，源码版助于了解内部详情，让我们一起学习吧
研究基于 Vue版本 【2.5.17】

如果你觉得排版难看，请点击 下面链接 或者 拉到 下面关注公众号也可以吧

【Vue原理】Props - 源码版

今天记录 Props 源码流程，哎，这东西，就算是研究过了，也真是会随着时间慢慢忘记的。

幸好我做了详细的文章，忘记了什么的，回忆起来必然是很快的。

好的，回到正题，Props

请你在读这篇之前，先去看看我的白话版

【Vue原理】Props - 白话版

在上面这篇文章中，也已经清楚地解决了一个问题

父组件 如何 把数据 当做 props 传给子组件

所以今天，我们只需记录 Props 的处理流程源码即可

---

初始化

在创建Vue实例的过程中，会调用 initState 处理options，比如 props，computed，watch 等

只要你 new Vue 创建实例之后，很快就会处理options

function Vue(){
    ... 其他处理
    initState(this)

    ...解析模板，生成DOM 插入页面

}

function initState(vm) {    

    var opts = vm.$options;    

    if (opts.props) {

        initProps(vm, opts.props);
    }

    ... 处理 computed，watch，methods 等其他options

}

initProps

你看