vue.extend与vue.component的区别和联系

一味的闷头开发,却对基础概念缺乏理解,是个大坑... 查阅官网后现对自己的理解记录一下,用于日后复习巩固

Vue.extend({}) 简述:使用vue.extend返回一个子类构造函数,也就是预设部分选项的vue实例构造器。

后可使用vue.component进行实例化、或使用new extendName().$mount('' el)方式进行实例化(从而实现模拟组件)。

1   let Footer = Vuew.extend({
2     data(){
3       return {
4         footerName:'I CAN DO IT...'
5       }
6     },
7     template:'<div>{{footerName}}</div>'
8   });

 Vue.component({})简述:不多介绍了。。。用于生成全局组件

使用:

  1,Vue.component使用Vue.extend生成的构造函数:

 Vue.component('footer-view',Footer);

  2,实例化构造函数从而模拟组件:

new Footer({data:{'...':''}}).$mount('my-footer')

完整代码:

<template><my-footer></my-footer>
</template>
<script>let Footer = Vuew.extend({data(){return {footerName:'I CAN DO IT...'}},template:'<div>{{footerName}}</div>'});Vue.component('footer-view',Footer);// new Footer({//   data:{//     '...':''//   }// }).$mount('my-footer')
</script>

  若有什么错误,欢迎指正。。。


更多专业前端知识,请上 【猿2048】www.mk2048.com

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

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

相关文章

2012服务器系统关闭网络共享,提供网络服务的前提,Windows Server 2012如何更改高级共享设置...

今天介绍系统提供网络服务的前提&#xff0c;Windows Server 2012 R2操作系统如何更改高级共享设置。小伙伴们可能都听说&#xff0c;网络配置是提供各种网络服务的前提。Windows Server 2012 R2操作系统安装完成以后&#xff0c;默认为自动获取IP地址&#xff0c;自动从网络中…

[学习笔记]几个英语短句(1)

Mind (you)!<口语>听着&#xff01;Mind , I dont say that it is certain.mind your back<口语>让开&#xff0c;让我通过。Mind your own business.你别管闲事。This is not your business.within an inch of 差点儿&#xff0c;险些&#xff01;The athlete was…

qt往mysql中添加数据_qt往数据库添加数据

{"moduleinfo":{"card_count":[{"count_phone":1,"count":1}],"search_count":[{"count_phone":4,"count":4}]},"card":[{"des":"阿里云数据库专家保驾护航&#xff0c;为用户…

Java中WeakReference,SoftReference,PhantomReference和Strong Reference之间的区别

很长一段时间以来&#xff0c;WeakReference和SoftReference都已添加到Java API中&#xff0c;但是并不是每个Java程序员都熟悉它。 这意味着在Java中使用WeakReference和SoftReference的位置和方法之间存在差距。 参考类对于垃圾收集的工作方式尤其重要。 众所周知&#xff0c…

Elasticsearch 深入3

分词器的内部组成到底是什么&#xff0c;以及内置分词器的介绍 1、什么是分词器 切分词语&#xff0c;normalization&#xff08;提升recall召回率&#xff09; 给你一段句子&#xff0c;然后将这段句子拆分成一个一个的单个的单词&#xff0c;同时对每个单词进行normalization…

[WC2014]时空穿梭(莫比乌斯反演)

https://www.cnblogs.com/CQzhangyu/p/7891363.html 不难推到$\sum\limits_{D1}^{m_1}\sum\limits_{d|D}C_{d-1}^{c-2}\mu(\frac D d)\prod\limits_{i1}^n\frac {(2m_i-({\lfloor \frac {m_i} {D} \rfloor}1)\times D){\lfloor \frac {m_i} {D} \rfloor}}{2}$。 $O(Tnm)$&#…

css设置字符长度,在css中设置最大字符长度

12 个答案:答案 0 :(得分&#xff1a;199)你总是可以通过设置max-width和溢出ellipsis来使用截断方法p {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;max-width: 200px;}对于多行截断&#xff0c;请查看flex解决方案。截断3行的示例。p {overflow: hidden;d…

一些sql 语句(行列转换等)

1. 行列转换--普通假设有张学生成绩表(CJ)如下Name Subject Result张三 语文 80张三 数学 90张三 物理 85李四 语文 85李四 数学 92李四 物理 82想变成 姓名 语文 数学 物理张三 80 90 85李四 85 92 82declare sql varchar(4000)set sql select Nameselect sql sql ,sum(cas…

关于html以及js相关格式验证的记录

验证的常见方式 我们在写前端的时候或多或少的会遇到一些验证格式问题&#xff0c;通常我们有三种解决办法。 第一种就是在输入完成后在输入框附近验证给出提示第二种就是在输入完成后在提交的时候排着验证提示第三张就是限制输入 前面两种我们都是非常的熟悉以及想到的&…

mysql重做日志_MySQL-重做日志 redo log -原理

【redo log buffer】【redo log file】-原理目录&#xff1a;1.重做日志写入过程图2.相关知识点汇总图3.redo_log_buffer 原理4.redo_log_file 原理1. 重做日志写入过程&#xff1a;2. 相关知识点汇总&#xff1a;3. redo log buffer 原理重做日志缓冲(redo log buffer)是Innod…

Java 8 Friday:使用Streams API时的10个细微错误

在Data Geekery &#xff0c;我们喜欢Java。 而且&#xff0c;由于我们真的很喜欢jOOQ的流畅的API和查询DSL &#xff0c;我们对Java 8将为我们的生态系统带来什么感到非常兴奋。 Java 8星期五 每个星期五&#xff0c;我们都会向您展示一些不错的教程风格的Java 8新功能&#…

孤荷凌寒自学python第六十八天学习并实践beautifulsoup模块1

孤荷凌寒自学python第六十八天学习并实践beautifulsoup模块1 &#xff08;完整学习过程屏幕记录视频地址在文末&#xff09; 感觉用requests获取到网页的html源代码后&#xff0c;更重要的工作其实是分析得到的内容&#xff0c;因此这时候大名鼎鼎的BeautifulSoup模块就可以大展…

如何将h5网页改成微信网页

1、如何将h5网页改成微信网页 1、设置安全域名 先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。 备注&#xff1a;登录后可在“开发者中心”查看对应的接口权限。 2、引用一个js文件 在微信开发者里面 js sdk里面 <sc…

AspNetForums中基于角色的权限控制

AspNetForums中基于角色的权限控制 http://blog.joycode.com/dotey/archive/2005/02/24/44791.aspxasp.net页面如何控制页面依据不同用户权限有不可见、可见、编辑 三种操作权限 http://community.csdn.net/Expert/topic/3436/3436974.xml?temp.0139429做过权限管理和想做权限…

c#a服务器上传文件b服务器,C#_c#批量上传图片到服务器示例分享,客户端代码: 复制代码 代码 - phpStudy...

c#批量上传图片到服务器示例分享客户端代码&#xff1a;/// /// 批量上传图片/// /// 服务器路径/// 图片文件夹路径/// 图片名称public void UpLoadFile(string srcurl, string imagesPath, List files){int count 1;foreach (string imageName in files){string name image…

mysql集群重启offline_mysql集群搭建问题及解决方法集锦

在上一篇博客中写了如何搭建mysql集群&#xff0c;之所以遇到这些问题&#xff0c;是因为刚开始弄mysql集群的时候不熟悉&#xff0c;正是因为这些问题&#xff0c;让我对mysql集群的了解渐渐深入&#xff0c;下面介绍在搭建mysql集群的时候我遇到了一些问题。1、mysql集群安装…

C - CJSON

cJSON API说明cJSON_Version()获得cJSON的版本cJSON_InitHooks();初始化cJSON_Hooks结构体cJSON_Parse();将字符串解析成cJSON结构体cJSON_ParseWithOpts()使用一些配置解析字符串cJSON_Print()将cJSON结构体转换成格式化的字符串cJSON_PrintUnformatted()将cJSON结构体转换成…

Java SE 8新功能导览:Java开发世界中的重大变化

与其他专业团队成员一样&#xff0c;我是采用OpenJDK的成员之一&#xff0c;但是从最近8个月开始加入&#xff0c;我们经历了Java SE 8 开发&#xff0c;编译&#xff0c;编码&#xff0c;讨论等各个阶段&#xff0c;直到将其付诸实践为止。 。 它于2014年3月18日发布&#xff…

蘑菇街一电话面试1

说说你常用的技术栈&#xff1f; ajax解决跨域问题的方法&#xff1f;jsonp的主要实现原理&#xff1f; 点击页面某个按钮&#xff0c;将原本一行显示的内容分成两行&#xff0c;如何实现&#xff1f; 怎样实现段首缩进&#xff1f;值是什么&#xff1f; 如何实现文本限制显示两…

从Java官网下载最新的文档(包含API文档)

Java学习资料(适合c转java的同学)&#xff1a; Java中带包&#xff08;创建及引用&#xff09;的类的编译 - 小明快点跑 JAVA 对象引用&#xff0c;以及对象赋值 - 飘来荡去。 Java官网下载页&#xff1a;https://www.oracle.com/technetwork/java/javase/downloads/index.html…