Vue.extend构造器的延伸
来源:互联网 发布:网络语卡带是什么意思 编辑:程序博客网 时间:2024/06/16 20:08
一、什么是Vue.extend?
Vue.extend 返回的是一个“扩展实例构造器”,也就是预设了部分选项的Vue实例构造器。经常服务于Vue.component用来生成组件,可以简单理解为当在模板中遇到该组件名称作为标签的自定义元素时,会自动调用“扩展实例构造器”来生产组件实例,并挂载到自定义元素上。
二、自定义无参数标签
我们想象一个需求,需求是这样的,要在博客页面多处显示作者的网名,并在网名上直接有链接地址。我们希望在html中只需要写 ,这和自定义组件很像,但是他没有传递任何参数,只是个静态标签。
var authorExtend = Vue.extend({ template:"<p><a :href='authorURL'>{{authorName}}</a></p>", data:function () { return{ authorName:"xiexin", authorURL:"http://baidu.com" } } });
这时html中的标签还是不起作用的,因为扩展实例构造器是需要挂载的,我们再进行一次挂载。
new authorExtend().$mount('author');
三、挂载到普通标签上
还可以通过HTML标签上的id或者class来生成扩展实例构造器,Vue.extend里的代码是一样的,只是在挂载的时候,我们用类似jquery的选择器的方法,来进行挂载就可以了。
new authorExtend().$mount('#author');
阅读全文
0 0
- Vue.extend构造器的延伸
- Vue.extend构造器
- Vue.extend()构造器
- Vue2 全局-Vue.extend构造器拓展
- Vue.extend和Vue.component的区别
- vue的父子构造器
- vue.extend
- Vue.extend和Vue.component的联系与差异
- vue笔记----构造器
- Vue学习-构造器
- Vue实例 -构造器
- Vue 构造器
- 草图直线做延伸(Extend)初探
- vue.js基础-构造器
- vue.js基础-构造器
- vue.js基础-构造器
- 翻译extend应为延伸,翻译为继承是错误
- 前端框架vue.js系列(9):vue构造、vue组件与vue实例的关系
- css控制单行文字自动显示省略号
- 云星数据---Scala实战系列(精品版)】:Scala入门教程034-Scala实战源码-Scala apply方法02 初始化对象
- HTML中 CSS去除li前面的小黑点
- 每天回顾linux命令(who)
- JS基础学习第二天:猜数字游戏
- Vue.extend构造器的延伸
- [BZOJ]4530 [BJOI2014] 大融合 LCT维护子树信息
- Javase—集合框架Set
- 关于投稿
- Lua语法学习(一)
- Java的运行机制
- JSP中的九大内置对象
- mybatis如何遍历Map的key和value
- 定义类成员