vuejs数据和事件
<body>
<div id='root'>{{number}}</div>
<script>
new Vue({
el:'#root',
data:{
msg:'hello world',
number:123
}
})
</script>
</body>
{{number}} //这个语法我们把他叫做插值表达式，除了这种写法,还有两种写法
<h1 v-text='number'></h1> //不编译html,引号内部是个变量
<h1 v-html='number'></h1> //编译html
<div id='root'>
<div v-on:click="handleClick">{{content}}</div>
</div>
<script>
new Vue({
el:'#root',
data:{
content:'hello'
},
methods: {
handleClick:function(){
this.content = 'world';
}
}
})
</script>
用指令v-on:click绑定，方法写在methods选项里面，在vue里面把hello变成world，之前要去改变dom，vuejs里面不用改变dom，直接改变数据就好了，this.content表示这个实例Vue里面data的content的数据
<div @click="handleClick">{{content}}</div>
vuejs数据和事件的更多相关文章
- 一次tomcat数据乱码事件
一次环境变量出错导致的tomcat数据乱码事件 1.1 事件起因 由于业务的调整,我们需要将在A服务器上的后台系统迁移到B服务器上的后台,我们选择在下班后进行迁移,因为那个时间点,后台系统已经几乎没有 ...
- PB Event ID 含义 内容浅析2 未公开的数据窗口事件
原网址:https://www.cnblogs.com/lenya/archive/2010/11/12/3706971.html (作者:Mark Brown) 到目前为止,P ...
- jQuery 滚动条 滚动到底部（下拉到底部） 加载数据(触发事件、处理逻辑)、分页加载数据
1.针对浏览器整个窗口滚动 主要代码: <script type="text/javascript"> ; function GetProductListPageFun ...
- DIOCP之数据接收事件
一.不引用编码器与解码器的情况下(ECHO的DEMO) 类TIOCPtcpclient,接收服务器的数据事件:OnRecvBuffer 类TDiocpTcpServer,接收客户端数据事件:OnRec ...
- jQuery异步加载数据添加事件
几个月前在一个项目中涉及到树形栏,然后看了很多插件,觉得有点麻烦,于是自己写了一个,写着写着就出问题了. 当时项目是通过树形栏进行权限控制的,管理员可以对从数据库去的数据动态生成树形栏进行增删改查操作 ...
- vuejs数据双向绑定原理（get & set)
前端的数据双向绑定指的是view(视图)和model(数据)两者之间的关系:view层是页面上展示给用户看的信息,model层一般是指通过http请求从后台返回的数据.view到model的绑定都是通 ...
- Swing-JTable检测单元格数据变更事件
在JTable的初级教程中往往会提到,使用TableModel的 addTableModelListener方法可以监听单元格数据的变更,在其事件处理函,数tableChanged中,可以通过e.ge ...
- vue组件-子组件向父组件传递数据-自定义事件
自定义事件 我们知道,父组件是使用 props 传递数据给子组件,但如果子组件要把数据传递回去,应该怎样做?那就是自定义事件!
- [转]vue数据绑定(数据,样式,事件)
1.mounted 与 methods 与 computed 与 watched区别 From:https://blog.csdn.net/qinlulucsdn/article/details/80 ...
随机推荐
- uva 10817（数位dp）
uva 10817(数位dp) 某校有m个教师和n个求职者,需讲授s个课程(1<=s<=8, 1<=m<=20, 1<=n<=100).已知每人的工资c(10000 ...
- bzoj2502: 清理雪道（有源汇有上下界最小流）
传送门 别说话,自己看,我不会->这里 我这里用的建图方法是先跑一次最大流,连上$(t,s,inf)$之后再跑一遍,然后答案就是之前连的那条边的反向边的流量 据说还有种方法是连上$(t,s,in ...
- 动手写一个简单版的谷歌TPU-矩阵乘法和卷积
谷歌TPU是一个设计良好的矩阵计算加速单元,可以很好的加速神经网络的计算.本系列文章将利用公开的TPU V1相关资料,对其进行一定的简化.推测和修改,来实际编写一个简单版本的谷歌TPU.计划实现到行为 ...
- PAT甲级——1098 Insertion or Heap Sort (插入排序、堆排序)
本文同步发布在CSDN:https://blog.csdn.net/weixin_44385565/article/details/90941941 1098 Insertion or Heap So ...
- POJ1034 The dog task
题目来源:http://poj.org/problem?id=1034 题目大意: 一个猎人在遛狗.猎人的路径由一些给定的点指定.狗跟随着猎人,要与主人同时到达那些指定的点.在丛林里有一些有趣的地方, ...
- Excel2010如何实现隔行设置背景色
当Excel表格中的数据很多,很有可能会出现看错行的现象,为防止看错行,可以隔行设置背景色.可以通过套用表格格式或者条件格式来达到隔行变色的效果 方法一:通过套用表格格式 1.选中要处理的单元格或者列 ...
- 剑指Offer——数组中只出现一次的数字（一个很帅的异或解法）
题目: 一个整型数组里除了两个数字之外,其他的数字都出现了两次.请写程序找出这两个只出现一次的数字. 看题目脑子里就出现做法了: 遍历,用个HashMap来记录出现的次数,然后再遍历HashMap返回 ...
- Unity Gizmos绘制指定长宽的网格
using UnityEngine; using System.Collections; public class GridMap : MonoBehaviour { ; //宽度 ; //长度 vo ...
- Java面向对象_单例设计模式
单例设计模式:保证一个类仅有一个实例,并提供一个访问它的全局访问点 1.构造方法私有化 2.声明一个本类对象 3.给外部提供一个静态方法获取对象实例 两种实现方式:饿汉式和懒汉式 何种情况下使用呢?当 ...
- (转)linux 中特殊符号用法详解
linux 中特殊符号用法详解 原文:https://www.cnblogs.com/lidabo/p/4323979.html # 井号 (comments)#管理员 $普通用户 脚本中 #!/b ...