vue源码分析（七）—— createComponent

10月前作者：前端张三分类：Toy博客阅读(31) 违法举报

这篇具有很好参考价值的文章主要介绍了vue源码分析（七）—— createComponent。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

前言

createComponent文件的路径： src\core\vdom\create-component.ts

一、createComponent 参数说明

vue源码分析（七）—— createComponent,vue2源码分析,vue.js,javascript,前端

二、createComponent 源码详解

1.baseCtor的实际指向

路径 src\core\instance\init.ts
根据init,ts的初始化中，会把Vue的options合并到vm的options上，所以baseCtor的实际指向其实是Vue上的options。

vue源码分析（七）—— createComponent,vue2源码分析,vue.js,javascript,前端

2.extend 方法

路径： src\core\global-api\extend.ts
判断是否是对象，如果是对象执行extend方法返回一个构造函数

vue源码分析（七）—— createComponent,vue2源码分析,vue.js,javascript,前端

3.判断Ctor是否是函数的判断

vue源码分析（七）—— createComponent,vue2源码分析,vue.js,javascript,前端

4.installComponentHooks方法

作用：安装组件的钩子

vue源码分析（七）—— createComponent,vue2源码分析,vue.js,javascript,前端

installComponentHooks方法详解

5.返回一个带标识的组件 vnode

vue源码分析（七）—— createComponent,vue2源码分析,vue.js,javascript,前端文章来源地址https://www.toymoban.com/news/detail-734434.html

到了这里，关于vue源码分析（七）—— createComponent的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：如若内容造成侵权/违法违规/事实不符，请点击违法举报进行投诉反馈，一经查实，立即删除！

分享到：

领支付宝红包赞助服务器费用

前端（四）——vue.js、vue、vue2、vue3

😊博主：小猫娃来啦 😊文章核心： vue.js、vue、vue2、vue3从全局到局部 Vue.js是一款流行的JavaScript框架 vue,vue2,vue3都是vue.js的不同版本。 Vue：Vue.js的第一个版本，也称为Vue 1.x。它于2014年首次发布，并获得了广泛的应用和认可。 Vue2：Vue.js的第二个版本，也称为Vue 2.x。它在Vu

2024年02月12日
浏览(79)
【Vue2】引入本地原生JS文件

日常开发的时候，第一个想法肯定是找现有的插件进行开发，在项目中npm install xxx 插件即可。但是也有无法使用的插件的情况，就需要我们引用我们本地的原生js。自己写的文件或者别人的插件都可以通过下面的方式修改成vue能够识别的js。字符操作文件 utils/str.js 在函数

2024年02月16日
浏览(47)
Vue2 API-源码

目录 Vue.extend(option) delimiters functional Vue.component(id, Function | Object) Vue.directive( id, [definition] ) Vue.filter( id, function) Vue.nextTick() Vue.set() Vue.delete(target, index/key) Vue.compile(template) Vue.observable(object) provide/inject extends、mixins 作用：返回一个vue子组件的构造函数参数：创建vue实例的参数

2023年04月11日
浏览(49)
vue2+three.js实现宇宙（进阶版）

2023.9.12今天我学习了vue2+three.js实现一个好看的动态效果：首先是安装： npm install three 相关代码如下：

2024年02月09日
浏览(42)
vue2项目之swiper.js 的使用

swiper.js 的使用官网 API（部署在 swiper 实例中）：https://www.swiper.com.cn/api/index.html 官网轮播图（查看源代码）：https://www.swiper.com.cn/demo/index.html 接下来介绍怎么在 vue2 里使用 swiper.js （vue2 使用 swiper5版本） 1、安装、引入css 2、在组件中使用：引入 js 引入 html 结构 html 结构：

2024年02月05日
浏览(51)
vue2源码（九）-- 挂载阶段

1、 $mounted 函数实际上调用的是 mountComponent 函数，该函数首先判断是否存在 render 函数，如果不存在，则给一个默认的渲染函数，该渲染函数会创建一个注释类型的 VNode 节点，然后给出警告。 2、触发 beforeMount 声明周期函数 3、定义 updateComponent 函数，该函数内部首先执行 r

2023年04月08日
浏览(30)
uniapp引入全局js，vue2/vue3不同方式引入

Hi I’m Shendi uniapp引入全局js，vue2/vue3不同方式引入最近写小程序，个人开发，选用了 uni-app 进行开发选用的 vue3 版本因为我用的 vue3 版本，在这里踩了没学过vue3的坑，用vue2引入全局js的方式使用，导致undefined… Vue2 版引入全局js的方法如下将js放到项目内，一般放到自建的

2024年02月03日
浏览(64)
vue2的vue.config.js中简单配置代理跨域

调用后端接口访问后台数据，但是因为请求url的协议、域名、端口三者之间任意一个与当前页面url不同产生了跨域，我们vue项目运行的地址一般就是localhost 8080端口，而且后端也没有配置允许跨域（后端如果配置跨域通常是cors），所以前端就要配置跨域，Vue跨域在vue.config.j

2024年02月15日
浏览(41)
支付宝，对接沙箱支付（vue2+node.js）

支付宝沙箱环境，点击进入 1. 扫码登录，进入后如图 2. 进入沙箱，可以看到自己的账号（如下配置）配置系统默认密钥（需要下载工具）密钥下载工具配置依照自己系统，自行选择下载配置支付宝开放平台密钥工具生成密钥后，不要关闭程序，在页面沙箱哪里配置系统密

2024年02月05日
浏览(65)
【Three.js】vue2导入pcd文件 PCDLoader

a. TypeError: Cannot read properties of null (reading \\\'1\\\') at parseHeader (PCDLoader.js?edd4:119:1) at PCDLoader.parse (PCDLoader.js?edd4:226:1) at Object.eval [as onLoad] (PCDLoader.js?edd4:34:1) at XMLHttpRequest.eval (three.module.js?5a89:34770:1) b. GET http://localhost:8080/public/Zaghetto 404 (Not Found) 两者本质同个问题，

2024年02月08日
浏览(43)