VueComponent构造函数

//创建school组件——注册给谁 在谁的结构上写const school = Vue.extend({name: 'school',//开发者工具的显示template: `<div><h2>学校名称:{{schoolName}}</h2><h2>学校地址:{{adress}}</h2>  </div>`,//结构data() {return {//防止相同对象改变schoolName: 'xxxx学校',adress: 'xxx街道',}},//数据
})const vm &#61; new Vue({el: &#39;#root&#39;,template:&#96;&lt;school&gt;&lt;/school&gt;&#96;,//2、注册组件 &#xff08;局部注册&#xff09;components: {school,}});</code></pre> 

定义的组件,是构造函数

每次调用组件的创建 Vue.extend 返回的都是全新的VueComponent的构造函数()

源码分析:每次调用

vm上的$children是组件vc

1、school组件本质是一个VueComponent的构造函数,不是程序员定义的,是Vue.extend生成的

2、我们只需要写 <school></school>或者 </school>,Vue解析的时候会帮我创建school组件的实例对象

即Vue帮我执行new VueComponent(options),使用几次调用几次

3、注意:每次调用组件的创建 Vue.extend 返回的都是全新的VueComponent的构造函数()

4、关于this指向

1、组件配置中

data函数、methods中的函数、watch函数、computed中的函数 this全部指向VueComponent实例对象

2、new Vue(options)配置中

data函数、methods中的函数、watch函数、computed中的函数 this全部指向Vue实例对象5、VueComponent的实例对象简称vc,也即是组件实例对象

Vue实例对象简称vm

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/832572.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

液晶数显式液压万能试验机WES-300B

一、简介 主机为两立柱、两丝杠、油缸下置式&#xff0c;拉伸空间位于主机的上方&#xff0c;压缩、弯曲试验空间位于主机下横梁和工作台之间。测力仪表采用高清液晶显示屏&#xff0c;实验数据方便直观。 主要性能技术指标 最大试验力&#xff08;kN&#xff09; 300 试…

FreeRTOS资源管理

1.以前临界资源的保护方式 有使用过静态局部变量来保护临界资源&#xff0c;也有用队列&#xff0c;信号量&#xff0c;互斥量来保护临界资源。这些都是在多个任务会共同使用临界资源的情况下我们的保护方式。 问题提出&#xff1a;如果有个传感器在读取数据时有严格的时序&a…

前端基础学习html(1)

1.标题标签.h1,h2...h6 2.段落标签p 换行标签br 3.加粗strong(b) /倾斜em(i) /删除 del(s) /下划线ins(u) 4.盒子&#xff1a;div //一行一个 span//一行多个 5.img :src alt title width height border 图片src引用&#xff1a;相对路径 上级/同级/中级 绝对路径&#xff…

触动精灵纯本地离线文字识别插件

目的 触动精灵是一款可以模拟鼠标和键盘操作的自动化工具。它可以帮助用户自动完成一些重复的、繁琐的任务&#xff0c;节省大量人工操作的时间。但触动精灵的图色功能比较单一&#xff0c;无法识别屏幕上的图像&#xff0c;根据图像的变化自动执行相应的操作。本篇文章主要讲解…

【Java基础】三大特性——多态

多态的前提条件&#xff1a;继承可以简单理解为&#xff1a;把子类看成父类类型&#xff08;反之是错误的&#xff09; 优缺点 弊端: 只能使用父类&#xff08;父接口&#xff09;中定义的功能好处: 函数的参数定义为父类&#xff08;父接口&#xff09;类型&#xff0c;可以…

使用idea编辑器回退git已经push的代码

直接上结果 选择想要回退的那次/多次提交历史, 右击, 选中 revert commit git自动产生一个Revert记录&#xff0c;然后我们会看到git自动将我第三次错误提交代码回退了&#xff0c;这个其实就相当于git帮我们手动回退了代码。 后续&#xff0c;只需要我们将本次改动push到远…

Vue 介绍

【1】前端发展史 前端的发展史可简述为&#xff1a; 从最初的静态页面编写&#xff0c;依赖后端模板渲染逐步演化为通过JavaScript&#xff08;特别是Ajax技术&#xff09;实现前后端分离&#xff0c;使得前端能够独立地加载数据和渲染页面随后&#xff0c;Angular、React、Vu…

open 函数到底做了什么

使用设备之前我们通常都需要调用 open 函数&#xff0c;这个函数一般用于设备专有数据的初始化&#xff0c;申请相关资源及进行设备的初始化等工作&#xff0c;对于简单的设备而言&#xff0c;open 函数可以不做具体的工作&#xff0c;你在应用层通过系统调用 open 打开设备…

2024年电化学、可再生能源与绿色发展国际会议(ICERGD2024)

2024年电化学、可再生能源与绿色发展国际会议(ICERGD2024) 会议简介 2024国际电化学、可再生能源与绿色发展大会&#xff08;ICERGD2024&#xff09;将在青岛隆重举行。本次会议聚焦电化学、可再生能源和绿色发展领域的最新研究成果和技术趋势&#xff0c;旨在促进相关领域…

OpenNJet:下一代云原生应用引擎

OpenNJet&#xff1a;下一代云原生应用引擎 前言一、技术架构二、新增特性1. 透明流量劫持2. 熔断机制3. 遥测与故障注入 三、Ubuntu 发行版安装 OpentNJet1. 添加gpg 文件2. 添加APT 源3. 安装及启动4. 验证 总结 前言 OpenNJet&#xff0c;是一款基于强大的 NGINX 技术栈构建…

typescript类型基础

typescript类型基础 枚举类型 enum Season {Spring,Summer,Fall,Winter }数值型枚举 enum Direction {Up,Down,Left,Right } const direction:Direction Direction.up每个数值型枚举成员都表示一个具体的数字&#xff0c;如果在定义一个枚举的时候没有设置枚举成员的值&…

Excel利用数据透视表将二维数据转换为一维数据(便于后面的可视化分析)

一维数据&#xff1a;属性值都不可合并&#xff0c;属性值一般在第一列或第一行。 二维数据&#xff1a;行属性或列属性是可以继续合并的&#xff0c;如下数据中行属性可以合并为【月份】 下面利用数据透视表将二维数据转换为一维数据&#xff1a; 1、在原来的数据上插入数据透…

MySQL 社区经理:MySQL 8.4 InnoDB 参数默认值为什么要这么改?

MySQL 8.4 LTS 版本&#xff0c;我们一共修改了 20 个 InnoDB 变量的默认值。 作者&#xff1a;Frederic Descamps&#xff0c;EMEA 和亚太地区的 MySQL 社区经理。于 2016 年 5 月加入 MySQL 社区团队。担任开源和 MySQL 顾问已超过 15 年。最喜欢的主题是高可用和高性能。 本…

解决一个朋友的nbcio-boot的mysql数据库问题

1、原先安装mysql5.7数据库&#xff0c;导入我的项目里的带数据有报错信息 原因不明 2、只能建议用docker进行msyql5.7的安装 如下&#xff0c;可以修改成自己需要的信息 docker run -p 3306:3306 --name mastermysql -v /home/mydata/mysql/data:/var/lib/mysql -e MYSQL_R…

python绘图(pandas)

matplotlib绘图 import pandas as pd abs_path rF:\Python\learn\python附件\pythonCsv\data.csv df pd.read_csv(abs_path, encodinggbk) # apply根据多列生成新的一个列的操作&#xff0c;用apply df[new_score] df.apply(lambda x : x.数学 x.语文, axis1)# 最后几行 …

c#word文档:1.创建空白Word文档及保存/2.添加页内容...

---创建空白Word文档 --- &#xff08;1&#xff09;创建一个名为OfficeOperator的类库项目。引用操作Word的.NET类库 &#xff08;2&#xff09;定义用于操作Word的类WordOperator1。添加引用Microsoft.Office.Interop.Word命名空间。 &#xff08;3&#xff09;为WordOper…

Unity | Shader基础知识(第十三集:编写内置着色器阶段总结和表面着色器的补充介绍)

目录 前言 一、表面着色器的补充介绍 二、案例viewDir详解 1.viewDir是什么 2.viewDir的作用 3.使用viewDir写shader 前言 注意观察的小伙伴会发现&#xff0c;这组教程前半部分我们在编写着色器的时候&#xff0c;用的是顶点着色器和片元着色器的组合。 SubShader{CGPRO…

个股期权是什么,个股期权使用方法?

今天期权懂带你了解个股期权是什么,个股期权使用方法&#xff1f;个股期权作为金融市场的重要工具之一&#xff0c;是指投资者在约定时间内有权而非义务以约定价格买卖特定数量的个股的金融衍生品。 个股期权是什么&#xff1f; 个股期权合约是一种由交易所统一设定的标准化合…

git-新增业务代码分支

需求 使用git作为项目管理工具管理项目&#xff0c;我需要有两个分支&#xff0c;一个分支是日常的主分支&#xff0c;会频繁的推送和修改代码并推送另外一个是新的业务代码分支&#xff0c;是一个长期开发的功能&#xff0c;同时这个业务分支需要频繁的拉取主分支的代码&#…

Python_GUI框架 Pyside6的常用部件介绍

PySide6是一个非常完善的商用级别的GUI框架&#xff0c;涉及的知识点相对比较多&#xff0c;今天我先在这里介绍一下我们在实际应用中最常见的几种部件及其功能&#xff1a; 1. QMainWindow QMainWindow 提供了一个主应用程序窗口的框架&#xff0c;通常包含一个菜单栏、工具…