Component 初识组件
component组件是Vue学习的重点、重点、重点,重要的事情说三遍。所以你必须学好Vue component。其实组件就是制作自定义的标签,这些标签在HTML中是没有的。比如:<diy></diy>,那我们就开始学习这种技巧吧。
全局化注册组件
html
<div id="app">
<!-- 注册一个全局逐渐 -->
<register></register>
</div>
js
var demo = Vue.component('register',{
template:"<h2>{{message}}</h2>",
data:function(){
return{
message:"component注册的全局组件"
}
}
})
new demo().$mount('register')
// 或者你这样使用,下面是挂载到#app的意思,你引掉他们,直接用$mount挂载
// var vm = new Vue({
// el:"#app",
// data:{
// }
// })
局部注册组件
html
<div id="app">
<!-- 注册一个全局逐渐 -->
<register></register>
</div>
js
var demoTmp ={
template:`<h2>{{message}}</h2>`,
data:function(){
return{
message:"内部组件components"
}
}
}
var vm = new Vue({
el:"#app",
data:{ },
components:{
'register':demoTmp
}
})
Component 初识组件的更多相关文章
- Vue2.0 【第二季】第6节 Component 初识组件
目录 Vue2.0 [第二季]第6节 Component 初识组件 第6节 Component 初识组件 一.全局化注册组件 二.局部注册组件局部 三.组件和指令的区别 Vue2.0 [第二季]第6节 ...
- 022 component(组件)关联映射
Component关联映射: 目前有两个类如下: 值对象没有标识,而实体对象具有标识,值对象属于某一个实体,使用它重复使用率提升,而且更清析. 以上关系的映射称为component(组件)关联映射 在 ...
- Solr学习笔记之5、Component(组件)与Handler(处理器)学习
Solr学习笔记之5.Component(组件)与Handler(处理器)学习 一.搜索篇 拼写检查(spellCheck) 作用:用来检查用户输入的检索内容是否存在,如果不存在则给它提示出相近或相似 ...
- vue19 组建 Vue.extend component、组件模版、动态组件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Vue2.0 【第二季】第8节 Component 父子组件关系
目录 Vue2.0 [第二季]第8节 Component 父子组件关系 第8节 Component 父子组件关系 一.构造器外部写局部注册组件 二.父子组件的嵌套 Vue2.0 [第二季]第8节 Co ...
- vue 初识组件
Vue.component("greeting",{ template: `<p>{{ name }}大家好 <button v-on:click="c ...
- angular2 学习笔记 ( Dynamic Component 动态组件)
更新 2018-02-07 详细讲一下 TemplateRef 和 ViewContainerRef 的插入 refer : https://segmentfault.com/a/1190000008 ...
- Extjs 继承Ext.Component自定义组件
//自定义HTML组件 Ext.define('MyCmp', { extend: 'Ext.Component', renderTpl: [ '<h1 class="title&qu ...
- 2-3 【初识组件】顶部 TabBar
VsCode中使用Emmet神器快速编写HTML代码 1 根组件下面包含了很多的子组件 组件就是控制屏幕的某一个部分,某一个区域 组件是可以相互包含的 组件是定义在类里面的,类里面有属性和方法 注解会 ...
随机推荐
- 如何在Sitecore CMS中创建没有标准字段的模板
当创建一个模板,Sitecore的将默认为扩大“标准模板”,它位于/sitecore/templates/System/Templates. 如果您选择不扩展任何模板或从“基本模板”字段中删除标准模板 ...
- JavaScript--定时器setTimeout()、clearTimeout(var param)和setInterval()、clearInterval(var param)
1.setTimeout().clearTimeout(var param) setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式,只调用一次 clearTimeout() 方法可取 ...
- 【2017-03-02】C#集合,结构体,枚举
集合 集合与数组的区别 数组:同一类型,固定长度 集合:不同类型,不固定长度 使用集合前需要: 引用命名空间:using System.Collections; 1.普通集合 定义: Arra ...
- qDeleteAll 之后必须清空容器
[1]qDeleteAll应用示例 qDeleteAll源码如下: template <typename ForwardIterator> Q_OUTOFLINE_TEMPLATE voi ...
- linux常用命令:touch 命令
linux的touch命令不常用,一般在使用make的时候可能会用到,用来修改文件时间戳,或者新建一个不存在的文件. 1.命令格式: touch [选项]... 文件... 2.命令参数: -a ...
- NoSql Cassandra
我们为什么要使用NOSQL非关系数据库? 随着互联网web2.0网站的兴起,非关系型的数据库现在成了一个极其热门的新领域,非关系数据库产品的发展非常迅速.而传统的关系数据库在应付web2.0网站,特别 ...
- pic_scrapy_python
# _*_ coding:UTF-8 _*_ import requests,json,time,sys from contextlib import closing class get_photos ...
- Spring Boot 中使用 @ConfigurationProperties 注解
@ConfigurationProperties 主要作用:绑定 application.properties 中的属性 例如: @Configuration public class DataSou ...
- IP代理(proxies参数)
在爬虫的过程中,我们经常会遇见很多网站采取了防爬取技术,或者说因为自己采集网站信息的强度和采集速度太大,给对方服务器带去了太多的压力. 如果你一直用同一个代理ip爬取这个网页,很有可能ip会被禁止访问 ...
- Let's Encrypt申请证书及使用
Let's Encrypt是一个免费的.自动的,开放的CA. 形形色色有证书扩展名和类型,我是通过这篇文章明白个大体的:http://www.cnblogs.com/guogangj/p/411860 ...