<!DOCTYPE html>

<html lang="en">

    <head>

        <meta charset="UTF-8">

        <script type="text/javascript" src="vue2.2.js"></script>

        <title>vue.extend-扩展实例构造器</title>

    </head>

    <body>

        <h1>vue.extend-扩展实例构造器</h1>

        <task></task>

        <script type="text/javascript">

            var task = Vue.extend({

                template: "<p><a :href='taskUrl'>{{myName}}</a></p>",

                data: function() {

                    return {

                        myName: 'baidu',

                        taskUrl: 'http://www.baidu.com'

                    }

                }

            });

            new task().$mount('task');

        </script>

    </body>

</html>

还可以通过HTML标签上的id或者class来生成扩展实例构造器，Vue.extend里的代码是一样的，只是在挂载的时候，我们用类似jquery的选择器的方法，来进行挂载就可以了。

vue2.0 vue.extend()的拓展的更多相关文章

  1. vue2.0 vue.set()

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. Vue2.0 Vue.set的使用

    原文链接: https://blog.csdn.net/qq_30455841/article/details/78666571

  3. vue1.0和vue2.0的区别(二)

    这篇我们继续之前的vue1.0和vue2.0的区别(一)继续说 四.循环 学过vue的同学应该知道vue1.0是不能添加重复数据的,否则它会报错,想让它重复添加也不是不可以,不过需要定义别的东西 而v ...

  4. VUE2.0学习总结

    摘要: 年后公司项目开始上vue2.0,自己对学习进行了总结,希望对大家有帮助! VUE2.0学习 vue介绍 vue是什么? https://vuefe.cn/guide vue也是一个数据驱动框架 ...

  5. Vue2.0 【第二季】第2节 Vue.extend构造器的延伸

    目录 Vue2.0 [第二季]第2节 Vue.extend构造器的延伸 一.什么是Vue.extend 二.自定义无参数标签 三.挂载到普通标签上 Vue2.0 [第二季]第2节 Vue.extend ...

  6. Vue2.0 - 构造器的延伸 Vue.extend

    Vue.extend 返回的是一个“扩展实例构造器”,也就是预设了部分选项的Vue实例构造器.经常服务于Vue.component用来生成组件,可以简单理解为当在模板中遇到该组件名称作为标签的自定义元 ...

  7. vue2.0 vs vue

    vue2.0相比vue1.0 有哪些改变,今天总结了一下 vue2.0组件中 template 不在支持代码片段 //vue1.0组件中template写法 <template> < ...

  8. vue2.0实践 —— Node + vue 实现移动官网

    简介 使用 Node + vue 对公司的官网进行了一个简单的移动端的实现. 源码 https://github.com/wx1993/node-vue-fabaocn 效果 组件 轮播图(使用 vu ...

  9. 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十五 ║Vue基础：JS面向对象&字面量& this字

    缘起 书接上文<从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十四 ║ VUE 计划书 & 我的前后端开发简史>,昨天咱们说到了以我的经历说明的web开发经历的 ...

随机推荐

  1. Android图片载入缓存框架Glide

    Glide开源框架是Google推荐的图片载入和缓框架,其在Github上的开源地址是:https://github.com/bumptech/glide 当然一个Google推荐的框架肯定就是Vol ...

  2. XMU 1617 刘备闯三国之汉中之战 【BFS+染色】

    1617: 刘备闯三国之汉中之战 Time Limit: 1000 MS  Memory Limit: 128 MBSubmit: 6  Solved: 5[Submit][Status][Web B ...

  3. mysql14---手动备份

    PHP定时完成数据库的备份 1.手动备份数据库(表的)方法 cmd控制台(windows指令): mysqldump –u root –proot 数据库 [表名1 表名2..] > 文件路径 ...

  4. Ubuntu 12.04 make menuconfig 出现 Unable to find the ncurses libraries or the required header files.

    问题: *** Unable to find the ncurses libraries or the *** required header files. *** 'make menuconfig' ...

  5. Android5.1修改以太网MAC地址（SElinux）【转】

    本文转载自:http://blog.csdn.net/LoongEmbedded/article/details/71477203 最近高通平台Android5.1项目中有个关于设置以太网MAC的需求 ...

  6. AppCompatActivity、ActionBarActivity、FragmentActivity和Activity的区别

    package com.chy.myapplication; import android.support.v7.app.AppCompatActivity; import android.os.Bu ...

  7. linkerd——针对java的为微服务提供可靠性的proxy，服务发现重试LB等

    Buoyant是一家云服务公司,宣布了Linkerd(发音为“linker-DEE”)的一周年纪念日,这是一个基于微服务的原生云应用程序的开源“服务网格”项目.诚如公告所述: 在20世纪90年代,TC ...

  8. linux 下使用exp/imp 或者expdp/impdp导出导入oracle数据表数据

    一.环境配置 1.执行环境: exp/imp可以在客户端执行也可以在服务器端执行,在客户端执行需要先安装有oracle的客户端,如果是linux系统,就是以oracle用户登录,在控制台下执行.建议在 ...

  9. [Tjoi2016&Heoi2016] 树

    [题目链接] https://www.lydsy.com/JudgeOnline/problem.php?id=4551 [算法] 树链剖分 时间复杂度 : O(QlogN) [代码] #includ ...

  10. 淘淘商城项目_同步索引库问题分析 + ActiveMQ介绍/安装/使用 + ActiveMQ整合spring + 使用ActiveMQ实现添加商品后同步索引库_匠心笔记

    文章目录 1.同步索引库问题分析 2.ActiveM的介绍 2.1.什么是ActiveMQ 2.2.ActiveMQ的消息形式 3.ActiveMQ的安装 3.1.安装环境 3.2.安装步骤 4.Ac ...