1，局部组件就是在Vue对象内部注册的构造器

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>局部组件</title>

    <script src="https://cdn.bootcss.com/vue/2.2.2/vue.min.js"></script>

</head>

<body>

    <div id="demo">

        <mynode></mynode>

    </div>

    <template id="node_one">

        <div>

            <div>第一个组件</div>

            <h1>标题一</h1>

            <p>段落一</p>

        </div>

    </template>

    <script>

        let child_one = Vue.extend({    <!--extend方法构造出组件-->

            template:"#node_one"

        });

        new Vue({

            el:"#demo",

            components:{"mynode":child_one}   <!--components是在Vue对象内注册组件用的-->

        });

    </script>

</body>

</html>

2，全局组件就是在全局注册的构造器

Vue的组件的更多相关文章

  1. vue.js组件化开发实践

    前言 公司目前制作一个H5活动,特别是有一定统一结构的活动,都要码一个重复的轮子.后来接到一个基于模板的活动设计系统的需求,便有了下面的内容.借油开车. 组件化 需求一到,接就是怎么实现,技术选型自然 ...

  2. 如何理解vue.js组件的作用域是独立的

    vue.js组件的作用域是独立,可以从以下三个方面理解: 1.父组件模板在父组件作用域内编译,父组件模板的数据用父组件内data数据:2.子组件模板在子组件作用域内编译,子组件模板的数据用子组件内da ...

  3. Vue 子组件向父组件传参

    直接上代码 <body> <div id="counter-event-example"> <p>{{ total }}</p> & ...

  4. VUE.JS组件化

    VUE.JS组件化 前言 公司目前制作一个H5活动,特别是有一定统一结构的活动,都要码一个重复的轮子.后来接到一个基于模板的活动设计系统的需求,便有了下面的内容.借油开车. 组件化 需求一到,接就是怎 ...

  5. Vue动态组件

    前面的话 让多个组件使用同一个挂载点,并动态切换,这就是动态组件.本文将详细介绍Vue动态组件 概述 通过使用保留的 <component> 元素,动态地绑定到它的 is 特性,可以实现动 ...

  6. vue中组件的四种方法总结

    希望对大家有用 全局组件的第一种写法 html: <div id = "app"> <show></show></div> js: ...

  7. 如何抽象一个 Vue 公共组件

    之前一直想写一篇关于抽象 Vue 组件的随笔,无奈一直没想到好的例子.恰巧最近为公司项目做了一个数字键盘的组件,于是就以这个为例聊聊如何抽象 Vue 的组件. 先上 Demo 与 源码.(demo最好 ...

  8. vue的组件和生命周期

    Vue里组件的通信 通信:传参.控制.数据共享(A操控B做一个事件) 模式:父子组件间.非父子组件 父组件可以将一条数据传递给子组件,这条数据可以是动态的,父组件的数据更改的时候,子组件接收的也会变化 ...

  9. 为什么VUE注册组件命名时不能用大写的？

    这段时间一直在弄vue,当然也遇到很多问题,这里就来跟大家分享一些注册自定义模板组件的心得 首先"VUE注册组件命名时不能用大写"其实这句话是不对的,但我们很多人开始都觉得是对的, ...

  10. vue的组件化运用（数据在两个组件互传，小问题总结）

    一.vue的组件化应用 首先,知道有哪些相关的属性需要用到,再慢慢去理解,运用. 1.两个vue页面 2. slot占位符(可用可不用) 3.props内置属性 4.watch监听函数 5.impor ...

随机推荐

  1. 图像处理------透明混合 - Alpha Blending效果

    基本原理: 图像的透明混合有个专属名词– Alpha Blending 对任意两张图像可以合成为一张图像,合成图像的像素取值根据数学公式: RGB3 = (1- a) * RGB1 + a * RGB ...

  2. Flex和Servlet结合上传文件报错（一）

    1.具体错误如下 一个表单域 不是一个表单域 java.io.FileNotFoundException: D:\MyEclipse\workspace\FlexFileUpload\Web\null ...

  3. zTree实现删除树节点

    zTree实现删除树节点 1.实现源码 <!DOCTYPE html> <html> <head> <title>zTree实现基本树</titl ...

  4. java特征

    java的核心是面向对象,与之相对的是面向过程的编程,在对整个java编程没有足够的理解和运用的情况下恐怕没办法很好的理解这两个概念. 在我的初步理解中,写一个程序就例如做一件事情,面向过程的思想或许 ...

  5. jquery.lazyload.js实现图片懒加载

    个人理解:将需要延迟加载的图片的src属性全部设置为一张相同尽可能小(目的是尽可能的少占宽带,节省流量,由于缓存机制,当浏览器加载了一张图片之后,相同的图片就会在缓存中拿,不会重新到服务器上拿)的图片 ...

  6. linux iscsi配置

    iSCSI 是一种 SAN的设备而 SAN的设备主要是提供 Server 存储体的空间.相较于传统的 SAN 是以光纤为传输媒体而 iSCSI(Internet SCSI)他是 IP-based 的数 ...

  7. zookeeper选举

    什么时候开始进行选举 1.服务器初始化启动的时候2.服务器运行期间连接不上leader的时候 初始化选举过程 进行leader选举至少需要两台服务器,我们这里举例为5台服务器(1,2,3,4,5)1. ...

  8. 实例 centos自动挂载、备份windows共享文件夹，并删除第7日前当天的备份

    此为用户twk的备份执行方案(192.168.42.246虚拟机数据库,备份到192.168.42.147的第二硬盘)此为用户twk的备份执行方案(192.168.42.5虚拟机数据库,备份到192. ...

  9. Fragment加载方式与数据通信

    一.加载方式 1. 静态加载 1.1 加载步骤 (1) 创建fragment:创建自定义Fragment类继承自Fragment类,同时将自定义Fragment类与Fragment视图绑定(将layo ...

  10. 初学者第二节之HelloWorld

    ava具有简单性.面向对象.分布式.健壮性.安全性.平台独立与可移植性.多线程.动态性等特点.Java可以编写桌面应用程序.Web应用程序.分布式系统和嵌入式系统应用程序等. 一.首先创建一个Hell ...