Vue视图下
3 Vue视图
3.5 样式绑定
class绑定
<p :class='对象'>
<p :class="数组">
<p :class="{类名:true/false, 类名:true/false}">
style绑定
<p :style="{color:'值', background:'值'}">
<p :style="[{}, {}, {}]">
3.6 事件
事件绑定
<p @事件名="方法">
<p v-on:事件名="方法">
方法加 () 的问题
<p @事件名="方法(1,1,2,3,$event)">
事件修饰符
.stop 阻止事件冒泡
.prevent 阻止默认动作
.capture 捕获阶段触发事件
.once 只绑定一次
.self 只有本身才触发
.passive 优化移动端的scroll事件
<p @click.stop="">
<p @click.stop.prevent="">
键盘修饰符
所有按键
.数字 (ascii )
特殊按键
.enter
.space
.tab
.up
.left
.right
.down
.delete
系统按键修饰符
.ctrl
.alt
.shift
.meta
<input @keyup.ctrl.enter> 按住ctrl再按回车
3.7表单
文本
input:text textarea v-model
checkbox 单个 true-value false-value
true/false
checkbox 多个
数组
单选按钮 input:redio v-model value值
select选择框 option的value值 多选 multiple, 数组
与对象中的属性双向链接
<input v-model="formData.username">
<input v-model="formData.pwd">
表单修饰符
v-model.trim
v-model.number 把值转为 number 类型
v-model.lazy
Vue视图下的更多相关文章
- Vue视图渲染原理解析,从构建VNode到生成真实节点树
前言 在 Vue 核心中除了响应式原理外,视图渲染也是重中之重.我们都知道每次更新数据,都会走视图渲染的逻辑,而这当中牵扯的逻辑也是十分繁琐. 本文主要解析的是初始化视图渲染流程,你将会了解到从挂载组 ...
- MVC4 Razor视图下使用iframe加载RDLC报表
MVC视图下默认是不支持服务器端控件的,所以,为了能够通过report viewer控件加载报表,需要在MVC视图添加嵌入的页面. 起初在stackoverflow上找到一个解决方案,见这里.不过这里 ...
- vue获取下拉框值
vue获取下拉框的值,用vue-modle,只有点击下拉框的值才会赋值到下拉框中,初始时下拉框没有数据,而改用$event就不会出现这样的问题,下面看代码以及图解: v-model解决方式: < ...
- Vue框架下的node.js安装教程
Vue框架下的node.js安装教程 python服务器.php ->aphche.java ->tomcat. iis -->它是一个可以运行JAVASCRIPTR 的运行环 ...
- vue环境下安装npm,启动npm 修改js,css样式
vue环境下修改js,css样式 1.在所在的项目项目的resource 文件夹下面,shift + 鼠标右键--在此处打开命令行窗口: 2.在打开的窗口执行: 安装npm:npm install 启 ...
- vue select下拉框绑定默认值
vue select下拉框绑定默认值: 首先option要加value值,以便v-model可以获取到对应选择的值 一.当没有绑定v-model,直接给对应的option加selected属性 二.当 ...
- vue props 下有验证器 validator 验证数据返回true false后,false给default值
vue props 下有验证器 validator 验证数据返回true false后,false给default值 props: { type: { validator (value) { retu ...
- Huawei-R&S-网络工程师实验笔记20190524-VRP的系统、接口视图下基本操作
>Huawei-R&S-网络工程师实验笔记20190524-VRP的系统.接口视图下基本操作(重命名.配置IP.VLAN接口.双工模式.console口) >>实验开始,先上 ...
- vue项目打包后想发布在apache www/vue 目录下
使用的是vue-element-admin做示例,可以参考Vue项目根据不同运行环境打包项目,其他项目应该大同小异. 使用vue-router的browserHistory模式,配置mode: 'hi ...
随机推荐
- 编写jquery Plugin
编写jquery插件的原则 1.给$.fn绑定函数,实现插件的代码逻辑 2.插件函数最后要return this,以支持链式调用 3.插件函数要有默认值,绑定在$.fn.<pluginName& ...
- Kaggle机器学习之模型集成(stacking)
Stacking是用新的模型(次学习器)去学习怎么组合那些基学习器,它的思想源自于Stacked Generalization这篇论文.如果把Bagging看作是多个基分类器的线性组合,那么Stack ...
- ARM中断向量表与响应流程【转】
转自:http://blog.csdn.net/honour2sword/article/details/40213417 一首先中断向量表定义在哪里?如何加载? 二 中断向量表与中断服务程序 三处理 ...
- linux编程之消息队列
消息队列是内核地址空间中的内部链表,通过linux内核在各个进程之间传递内容,消息顺序地发送到消息队列中,并且以几种不同的方式 从队列中获取,每个消息队列可以用IPC标识符唯一的进行标识,内核中的消息 ...
- selenium.webdriver.common.keys 模块中常用的变量
表11-5 selenium.webdriver.common.keys 模块中常用的变量属性 含义Keys.DOWN, Keys.UP, Keys.LEFT,Keys.RIGHT 键盘箭头键Keys ...
- Deep Learning基础--线性解码器、卷积、池化
本文主要是学习下Linear Decoder已经在大图片中经常采用的技术convolution和pooling,分别参考网页http://deeplearning.stanford.edu/wiki/ ...
- 辨别苹果数据线真伪 苹果计算器 Dashboard 知识
辨别苹果数据线真伪 苹果计算器 Dashboard 知识 苹果数据线真伪的最简单的辨别: 线质柔软 用数据线连接适配器(苹果自带的适配器)充电 连接手机 如果该手机数据线是假的, 在手机上会提示”该 ...
- [How to]如何自定义plist文件和读取plist文件内容
1.简介 plist作为IOS的固化文件,就好比java中properties文件,但是在IOS中plist是可读写的. 本文将介绍自定义静态的plist文件. 2.自定义静态plist文件 右击你的 ...
- puppet安装和配置
一.安装puppet准备 //安装准备 ,两台机器都要操作 . 两台机器 172.7.15.106 (server) 172.7.15.111 (client) . 关闭防火墙 setenforce ...
- 高德地图web 端智能围栏
最近有个项目,需要在web上批量给设备设置智能围栏,设备超出范围报警,查看高德地图webJS API,web端操作案例如,后台判断没有提供源码 <!-- 重点参数:iconStyle --> ...