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 ...
随机推荐
- Spark BlockManager 概述
Application 启动的时候: 1. 会在 SparkEnv 中实例化 BlockManagerMaster 和 MapOutputTracker,其中 (a) BlockManagerMast ...
- 2017-10-13 NOIP模拟赛
入阵曲 #include<iostream> #include<cstdio> #define maxn 401 #ifdef WIN32 #define PLL " ...
- PJzhang:英国通信总部GCHQ开源产品-网络瑞士军刀CyberChef
猫宁!!! 参考链接:https://www.4hou.com/info/news/981.html 这个产品免费开源易用,如果称之为网络瑞士军刀,没什么异议. github地址:https://gi ...
- dorado 常用
如果要设置模糊查询, 一般要在QueryCommand中这样写: var name = dsQuery.getValue("NAME"); var parameters = com ...
- gitlab web客户端的使用
3.2.1 新建项目 3.2.2 初始化项目(git init) 正如上图显示的,gitlab会给我们相应的命令供我们使用(需要安装客户端).初始化一个项目可以是一个新建的空项目,也可以是一个已经存在 ...
- 洛谷P5058 [ZJOI2004]嗅探器
题目描述 某军搞信息对抗实战演习,红军成功地侵入了蓝军的内部网络,蓝军共有两个信息中心,红军计划在某台中间服务器上安装一个嗅探器,从而能够侦听到两个信息中心互相交换的所有信息,但是蓝军的网络相当的庞大 ...
- Exadata中的dbserver_backup.sh脚本
dbserver_backup.sh脚本在老版本的exadata中,它存放在/opt/oracle.SupportTools目录中,主要用于/根文件系统和/boot分区的备份.dbserver_bac ...
- jmeter小问题解决方案合集
问题1.在http请求,post的body中输入中文,显示乱码,怎么解决? 在jmeter的bin目录下,找到这个文件jmeter.properties,把jsyntaxtextarea.font.f ...
- ACM-ICPC 2018 南京赛区网络预赛 E. AC Challenge (状态压缩DP)
Dlsj is competing in a contest with n (0 < n \le 20)n(0<n≤20) problems. And he knows the answe ...
- springBoot实现socketio
https://github.com/mrniko/netty-socketio-demo https://github.com/mrniko/netty-socketio