位置: 编程技术 - 正文

Vue官方文档梳理之全局配置(vue3官方文档)

编辑:rootadmin

推荐整理分享Vue官方文档梳理之全局配置(vue3官方文档),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:vue的官方文档,vue2.0文档,vue docs,vue官方文档下载,vue3.x文档,vue官方文档下载,vue的官方文档,vue2.0文档,内容如对您有帮助,希望把文章链接给更多的朋友!

本文主要介绍了Vue官方文档梳理之全局配置,分享给大家,也给自己留个笔记。具体如下:

optionMergeStrategies

用于自定义选项的合并策略,Vue已经预定义了一些自己配置项的合并策略,如下图所示。

比如props、methods、computed就是同一个策略:子配置项会覆盖父级配置项。源码如下:

什么时候才会用到这些配置的合并规则呢?查阅源码,发现只要调用mergeOptions时,就会用到上面的策略。总结下来有以下几种场景:

使用了 Vue.mixin 或 mixins 配置项 使用了 Vue.extend 或 extends 配置项或Vue.component(背后实际上是调用了Vue.extend) new Vue() 或 new Vue.extend()

单独使用一个时,也会触发合并规则,但是只会有child包含配置项,所以不需要合并。只有当多个一起使用时,比如 Vue.compeont 和 extends 、mixins 配置项一起使用,这个时候就parent和child都会有相同的配置项,这时候也才有所谓的合并,举个完整的例子来说明上述的场景。

控制台打印如下:

按顺序解释如下:

undefined "Vue.extend"合并 Vue.options 和 extendOptions undefined "Vue.component"合并 Vue.options 和 extendOptions undefined "extends"extends配置项合并先于mixins,此时合并的是 Vue.options 和extends配置,因此toVal是undefined extends mixins完成了extends合并,接着就是mixins,此时 Vue.options 上已经包含了extends的配置项,因此 toVal 是extends,fromVal就是mixins。最终合并后的值:extends&mixins extends&mixins newVue完成了extends和mixins后,最终合并vm.constructor和实例的options extends&mixins&newVue最终合并后的 customOption 的选项值

devtools

Vue官方文档梳理之全局配置(vue3官方文档)

离线下载chrome 扩展地址(不需要梯子): 涉及到执行用户配置的地方都放在 try catch 中,因此即使你 throw 抛出错误,整个实例也不会挂。

ignoredElements

首先要理解忽略的到底是什么?是元素本身还是包括元素里的内容(就像v-pre一样),首先要知道这个配置的背景,官网举了Web Components APIs(以下简称WCA)的例子,WCA和Vue.component一样,也可以自定义元素,不过这个目前还是个草案。那么对于Vue来讲,元素就可以分为:HTML原生元素,Vue自定义元素,WCA自定义元素。那么对于一个元素,Vue的判断顺序:原生 > Vue自定义 > ignoredElements > 无法识别,对于无法识别的Vue会假定你可能把Vue自己定义元素拼错了,因此会发出Unknown custom element的警告。另外:

Vue定义和HTML标签同名的元素是无效的,比如定义Vue.compoent('header',{}) ignoredElements包含Vue定义的元素是无效的 WCA自定义元素可以被构建虚拟dom

performance(2.2.0+)

只能在开发版上使用。caniuse上查询 performance 可知主流浏览器都已经支持,这个可以用于分析Vue组件在不同阶段中花费的时间,进而知道哪里可以优化。查看源码,发现在以下阶段加上了performance.measure。

performance.measure((组件名+ " render"), startTag, endTag); performance.measure((组件名+ " patch"), startTag, endTag); performance.measure((组件名 + " init"), startTag, endTag); performance.measure(((组件名 + " compile"), 'compile', 'compile end');

比如在谷歌浏览器中查看自定义组件Vue.component('my-component')的各个阶段花费的时间:

在 IE 中查看

productionTip(2.2.0+)

对于开发版本,会默认向控制台打印:

设置为false就不再显示。

标签: vue3官方文档

本文链接地址:https://www.jiuchutong.com/biancheng/377428.html 转载请保留说明!

上一篇:vue.js开发实现全局调用的MessageBox组件实例代码(vue.js 开发工具)

下一篇:Javascript的表单与验证-非空验证(js表单事件有哪些)

  • 小规模纳税人代收水电费税率
  • 公允价值变动损益属于什么科目
  • 企业境外参展 人员成本
  • 一般纳税人税费计算明细表
  • 运费收入算销售收入吗
  • 工程项目纳税
  • 固定资产计提折旧计入什么科目
  • 增值税留抵抵欠税政策解读
  • 餐饮发票数量单价必须填吗
  • 处置使用过的车辆
  • 损益类科目是否可以转出
  • 交易性金融资产的账务处理
  • 押金收不回来没钱怎么办
  • 商超陈列费
  • 其他综合收益和综合收益的关系
  • 持有营业执照
  • 小规模纳税人如何纳税
  • 简易征收一般纳税人可以收专票吗
  • 预付款发票可以入费用吗
  • 单次劳务费税率
  • 印花税的基数及标准是多少?
  • 填报企业所得税资产总额怎么填
  • 资金账簿印花税税率
  • 电子发票上传平台失败是什么意思
  • 生产型出口企业的概念
  • 非征期不允许上报汇总是怎么回事
  • mac显示器颜色不正常
  • 取得专用发票是进项还是销项
  • 事业单位财政拨款是编制吗
  • 资产处置收益期末有余额吗
  • 电费预提费用
  • 农业企业出租厂房需要交税吗
  • 重装win10系统怎么跳过创建用户名
  • 如何让电脑安全
  • php类型判断
  • 不给佣金
  • 境外向国内汇款新规
  • 经营租出的设备要计提折旧吗
  • 广播影视服务需要许可证吗
  • react reducer详解
  • 数据库防止重复数据
  • 用python处理图像
  • A Loepa oberthuri moth (© Robert Thompson/Minden Pictures)
  • node.js安装步骤
  • php上传图片到文件夹
  • 交通银行手机银行网页版
  • php实现页面静态化
  • 食堂员工自己吃饭违法吗
  • 预提费用的会计分录2018
  • 法人和自然人有什么区别通俗一点
  • 免税蔬菜交企业所得税吗
  • 单位银行提取大额现金最多能取多少
  • 收缩数据库日志文件对数据有影响吗
  • 金税盘锁死日期哪里看
  • mysql基础操作命令
  • 间接人工费用计入什么科目
  • 无形资产减值迹象有哪些
  • 用党委的经费买房可以吗
  • 电子商业承兑汇票的承兑有以下几种方式
  • 出口转内销补交进口增值税时间
  • 购买材料时如果没有取得购买材料的发票
  • 其他应收款款项性质如何填写
  • 公司原股东转让全部股权误把认缴金额写成转让金额
  • 办理三证合一多久能拿到
  • 发票作废了还能恢复吗?
  • 强制结束进程命令快捷键
  • win7系统搜索不到自己家wi-fi
  • linux安装bz2
  • 飞行歌曲
  • Time、Set、Smartdrv命令的使用方法
  • div+css布局的步骤
  • cocos2dx小游戏
  • jquery easyui有哪些特点
  • jquery.js插件
  • linux常用shell操作指令
  • nginx与php
  • jquery获取多个元素
  • 北京市税务局 案件
  • 应交税费应交增值税已交税金是什么意思
  • 行政单位,比如什么单位
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设