十二、Vue.extend构造器的延伸 短命女 2022-05-03 06:58 54阅读 0赞 # Vue.extend构造器的延伸 # ### 1、什么是Vue.extend? ### Vue.extend 返回的是一个“扩展实例构造器”,也就是预设了部分选项的Vue实例构造器。经常服务于Vue.component用来生成组件,可以简单理解为当在模板中遇到该组件名称作为标签的自定义元素时,会自动调用“扩展实例构造器”来生产组件实例,并挂载到自定义元素上。 由于我们还没有学习Vue的自定义组件,所以我们先看跟组件无关的用途。 ### 2、自定义无参数标签 ### 我们想象一个需求,需求是这样的,要在博客页面多处显示作者的网名,并在网名上直接有链接地址。我们希望在html中只需要写 ,这和自定义组件很像,但是他没有传递任何参数,只是个静态标签。 我们的Vue.extend该登场了,我们先用它来编写一个扩展实例构造器。代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <script type="text/javascript" src="../assets/js/vue.js"></script> <title>vue.extend-扩展实例构造器</title> </head> <body> <h1>vue.extend-扩展实例构造器</h1> <hr> <!--挂载点--> <author></author> <script type="text/javascript"> //扩展实例构造器 var authorExtend = Vue.extend({ //需要挂载的内容 template:"<p><a :href='authorUrl'>{ {authorName}}</a></p>", data:function(){ return{ authorName:'JSPang', authorUrl:'http://www.jspang.com' } } }); //挂载点 挂载 扩展实例构造器:authorExtend new authorExtend().$mount('author'); </script> </body> </html>
相关 构造器注入的好处(spring推荐构造器注入) Spring常见的注入方式 Field 注入(属性注入) @RestController public class TestController { 青旅半醒/ 2024年04月01日 11:39/ 0 赞/ 52 阅读
相关 JavaScript学习笔记(二十一)构造函数 面向对象 首先,我们要明确,面向对象不是语法,是一个思想,是一种 编程模式。 面向: 面(脸),向(朝着) 面向过程: 脸朝着过程 =》 关注着过程的编 超、凢脫俗/ 2023年10月06日 15:51/ 0 赞/ 14 阅读
相关 Scala主构造器和辅助构造器 类比下 Java构造器 Java构造器 基本语法 [修饰符] 方法名(参数列表) { 构造方法体 } 细节说明 1)在 Java 中一个 忘是亡心i/ 2023年01月13日 14:59/ 0 赞/ 169 阅读
相关 【基础】构造器 一 构造器介绍 对于方法的创建,可将其想象成为自己写的每个类都调用一次 initialize()。 这个名字提醒我们在使用对象之前,应首先进行这样的调用。但不幸的是 红太狼/ 2022年08月23日 08:56/ 0 赞/ 131 阅读
相关 构造器(C#) 一个东西的出现自然是有原因的,就像构造器一样。那为什么会有构造器呢? 首先,类都有默认的构造器,不管你是否显示定义。当我们要读取或赋值类中的属性时,需要先用new操作符实例化 ╰半橙微兮°/ 2022年08月21日 00:12/ 0 赞/ 136 阅读
相关 构造器 构造器的作用:创建对象 构造器格式:访问修饰符 类名(参数列表) \{ \} 为什么不写返回类型呢?因为本身构造器的作用就是返回一个对象,不允许更改其返 小灰灰/ 2022年06月04日 04:47/ 0 赞/ 190 阅读
相关 构造器注入 【例】通过构造器为User注入属性 在User类中创建有参构造方法 package com.shw; public class User { 深碍√TFBOYSˉ_/ 2022年05月21日 23:30/ 0 赞/ 182 阅读
相关 十二、Vue.extend构造器的延伸 Vue.extend构造器的延伸 1、什么是Vue.extend? Vue.extend 短命女/ 2022年05月03日 06:58/ 0 赞/ 55 阅读
相关 scala构造器 [2019独角兽企业重金招聘Python工程师标准>>> ][2019_Python_] ![hot3.png][] object ConstructorTest \{ 墨蓝/ 2022年01月14日 01:21/ 0 赞/ 246 阅读
还没有评论,来说两句吧...