第六章 组件 56 组件-组件中的data
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<!--1.导入Vue的包-->
<script src=" https://cdn.jsdelivr.net/npm/vue"></script>
</head> <body>
<div id="app">
<mycom1></mycom1>
</div> <script>
// 1.组件可以有自己的 data 数据
// 2.组件的 data 和实例的data 有点不一样,实例中的data 可以为一个对象,但是 组件中的data 必须是一个方法
//3.组件中 的data 除了必须为一个方法之外,这个方法内部,还必须返回一个对象才行
//4.组件中的data数据,使用方式,和实例中的data 使用方式完全一样!!!
Vue.component('mycom1',{
template:'<h1>这是全局组件---{{msg}}</h1>',
data:function(){
return{
msg:'这是组件中data定义的数据'
}
}
})
//创建 Vue 实例,得到 ViewModel
var vm = new Vue({
el:'#app',
data:{
msg:''
},
methods:{}
});
</script>
</body>
</html>
第六章 组件 56 组件-组件中的data的更多相关文章
- [Learn AF3]第六章 App Framework 3.0中的内置矢量图标
AF3的内置矢量图标 介绍:要使用af3中的图标,必须首先引入icon.css,由于文件中已经内置了字体文件数据,因此不需要引入字体文件支持. <link rel="styleshee ...
- 第六章 使用 Bootstrap Typeahead 组件(百度下拉效果)(续)
官方:http://twitter.github.io/typeahead.js/ 示例:http://twitter.github.io/typeahead.js/examples/(本文展示:Op ...
- 第六章 通过Service访问Pod(中)
6.2 Cluster IP 底层实现 Cluster IP 是一个虚拟IP,是由K8s节点上的iptables规则管理的. 使用类似轮询的方法访问Pod. 6.3 DNS 访问Service 在Cl ...
- KnockoutJS 3.X API 第六章 组件(5) 高级应用组件加载器
无论何时使用组件绑定或自定义元素注入组件,Knockout都将使用一个或多个组件装载器获取该组件的模板和视图模型. 组件加载器的任务是异步提供任何给定组件名称的模板/视图模型对. 本节目录 默认组件加 ...
- [Learn AF3]第五章 App Framework 3组件之Drawer——Side Menu
Drawer——Side menu 组件名称:Drawer 说明:af3中的side menu和af2中有很大变化,af3中的side menu实际上是通过插件$.afui.drawer来实现 ...
- ROS机器人程序设计(原书第2版)补充资料 (陆) 第六章 点云 PCL
ROS机器人程序设计(原书第2版)补充资料 (陆) 第六章 点云 PCL 书中,大部分出现hydro的地方,直接替换为indigo或jade或kinetic,即可在对应版本中使用. RGBD深度摄像头 ...
- 201671010140. 2016-2017-2 《Java程序设计》java学习第六章
java学习第六章 本周对与java中的接口,lambda表达式与内部类进行了学习,以下是我在学习中的一些体会: 1.接口: <1>.接口中的所有常量必须是public sta ...
- ASP.NET2.0自定义控件组件开发 第六章 深入讲解控件的属性
原文:ASP.NET2.0自定义控件组件开发 第六章 深入讲解控件的属性 深入讲解控件的属性持久化(一) 系列文章链接: ASP.NET自定义控件组件开发 第一章 待续 ASP.NET自定义控件组件开 ...
- 第六章、forms组件
目录 第六章.forms组件 一.注册功能手写 二.forms组件完整写法 基本使用 三.forms组件前端渲染标签组件 三.forms组件其他知识点 在python console测试 校验数据 f ...
随机推荐
- 用myeclipse连接MySQL8.0时没有配置jar包
先上测试代码 package testJdbc; import java.sql.Connection; import java.sql.DriverManager; import java.sql. ...
- nginx多线程高并发
直接上图 Master-Worker模式 1.Nginx 在启动后,会有一个 master 进程和多个相互独立的 worker 进程. 2.接收来自外界的信号,向各worker进程发送信号,每个进程都 ...
- 2019牛客暑期多校训练营(第七场)-E Find the median (线段树+离散化 区间为点)
题目链接:https://ac.nowcoder.com/acm/contest/887/E 题意:给出L[i],R[i],每次添加L[i]...R[i],求出此时的中位数. 思路:因为添加的数范围为 ...
- [转帖]字符编码笔记:ASCII,Unicode 和 UTF-8
字符编码笔记:ASCII,Unicode 和 UTF-8 http://www.ruanyifeng.com/blog/2007/10/ascii_unicode_and_utf-8.html 转帖 ...
- Oracle - 子查询、TOP - N
1 子查询 sql 中查询是可以嵌套的,一个查询的结果可以作为另外一个查询的条件.表. SELECT select_list FROM table WHERE expr operator (SELEC ...
- python 小数据池,代码块, is == 深入剖析
python小数据池,代码块的最详细.深入剖析 一. id is == 二. 代码块 三. 小数据池 四. 总结 一,id,is,== 在Python中,id是什么?id是内存地址,那就有人问了, ...
- Iview 中 获取 Menu 导航菜单 选中的值
期望效果: 原来,我用的是脚本来控制,然后........,再然后,我再去仔细看官方文档的时候,才发现,Menu组件 有那么两个事件,on-select 和 on-open-change ,好气啊,之 ...
- Docker——桥接网络配置
[root@localhost ~]# cd /etc/sysconfig/network-scripts/ [root@localhost network-scripts]# ls ifcfg-et ...
- 华为设备ACL与NAT技术
ACL 访问控制列表(Access Control Lists),是应用在路由器(或三层交换机)接口上的指令列表,用来告诉路由器哪些数据可以接收,哪些数据是需要被拒绝的,ACL的定义是基于协议的,它适 ...
- Codeforces 1244G. Running in Pairs
传送门 首先对于两个排列 $A,B$ 我们可以把 $A$ 从小到大排序并把 $B$ 重新和 $A$ 一一对应 显然这样不会影响 $\sum_{i=1}^{n}max(A_i,B_i)$ 的值 所以直接 ...