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 ...
随机推荐
- 《OD学spark》20160924scala基础
拓展: Hadoop 3.0 NameNode HA NameNode是Active NameNode是Standby可以有多个 HBase Cluster 单节点故障? HBaster -> ...
- Java学习笔记——Map接口
Map接口 Map接口 Map接口中键和值一一映射. 可以通过键来获取值. 异常 NoSuchElementException:访问的值不存在 ClassCastException:对象类型错误 Un ...
- centos7安装配置docker
1. 安装/升级Docker客户端 Docker 要求 CentOS 系统的内核版本高于 3.10 ,查看本页面的前提条件来验证你的CentOS 版本是否支持 Docker . uname -r 从 ...
- linux下find查找与批量替换文件中指定内容
经常在部署tomcat时需要替换配置文件中的ip,find命令批量替换还是很方便的 查找需要替换的ip,看看哪些文件有配置这个ip,执行下面命令: find ./ -type f -regex &qu ...
- spring /* 和 /** 的 区别。
例如 /** 拦截 /index/1 和 /index /* 代表 /index/1 而 /index 则不会被拦截
- Codeforces Round #506 (Div. 3) - D. Concatenated Multiples（思维拼接求是否为k的倍数）
题意 给你N个数字和一个K,问一共有几种拼接数字的方式使得到的数字是K的倍数,拼接:“234”和“123”拼接得到“234123” 分析: N <= 2e5,简单的暴力O(N^2)枚举肯定超时 ...
- Restful 3 -- 序列化组件（GET/PUT/DELETE接口设计）、视图优化组件
一.序列化组件 基于上篇随笔的表结构,通过序列化组件的ModelSerializer设计如下三个接口: GET 127.0.0.1:8000/books/{id} # 获取一条数据,返回值:{} PU ...
- Linux--1 初识
一.服务器核心知识 1.电脑和电脑的硬件组成 现在的人们几乎无时无刻不在使用着电脑!不管是桌上型电脑(桌机).笔记型电脑(笔电).平板电脑,还是智慧型手机等等,这些东西都算是电脑.虽然接触这么多,但是 ...
- GUI的最终选择 Tkinter(五)：Text用法
Text组件 绘制单行文本使用Label组件,多行选使用Listbox,输入框使用Entry,按钮使用Button组件,还有Radiobutton和Checkbutton组件用于提供单选或多选的情况, ...
- jsonignore的一个坑
import org.fasterxml.jackson.annotate.JsonIgnore; 和 import org.codehaus.jackson.annotate.JsonIgnore; ...