当我们在项目中遇见文本输入框的时候,获取时刻输入框中的值

1、v-model

<template>
<input type="text" v-model="inputval">
</template>
export default {
data(){
return {
inputval:'',
}
},
watch:{
inputval(){
console.log(this.inputval)
}
}
}

2、ref自定义一个方法

<template>
<input type="text" ref="input">
</template>
export default {
data(){
return {
inputval:'',
}
},
watch:{
inputval(){
console.log(this.$refs.usernameInput.value)
}
}
}

vue中ref在input中详解的更多相关文章

  1. Linux中/proc目录下文件详解

    转载于:http://blog.chinaunix.net/uid-10449864-id-2956854.html Linux中/proc目录下文件详解(一)/proc文件系统下的多种文件提供的系统 ...

  2. JQuery在循环中绑定事件的问题详解

    JQuery在循环中绑定事件的问题详解 有个页面上需要N个DOM,每个DOM里面的元素ID都要以数字结尾,比如说 ? 1 2 3 <input type="text" nam ...

  3. JavaScript中的鼠标滚轮事件详解

    JavaScript中的鼠标滚轮事件详解/*Firefox注册事件*/ ~~~Firefox: addEventListener('DOMMouseScroll', handler, false)if ...

  4. php_DWZ-JUI中碰到的问题解决方法详解(thinkphp+dwz)

    原文:php_DWZ-JUI中碰到的问题解决方法详解(thinkphp+dwz) 折腾了两天,dwz删除后,数据不能自动刷新,解决方案,直接看图  . 1. 删除.修改状态后无法刷新记录: 在dwz. ...

  5. JS中的函数节流throttle详解和优化

    JS中的函数节流throttle详解和优化在前端开发中,有时会为页面绑定resize事件,或者为一个页面元素绑定拖拽事件(mousemove),这种事件有一个特点,在一个正常的操作中,有可能在一个短的 ...

  6. vue2.0 中#$emit,$on的使用详解

    vue1.0中 vm.$dispatch 和 vm.$broadcast 被弃用,改用$emit,$on 1. vm.$on( event, callback ) 监听当前实例上的自定义事件.事件可以 ...

  7. Linux中Nginx安装与配置详解

    转载自:http://www.linuxidc.com/Linux/2016-08/134110.htm Linux中Nginx安装与配置详解(CentOS-6.5:nginx-1.5.0). 1 N ...

  8. Linux中/proc目录下文件详解(转贴)

      转载:http://www.sudu.cn/info/index.php?op=article&id=302529   Linux中/proc目录下文件详解(一) 声明:可以自由转载本文, ...

  9. python中的subprocess.Popen()使用详解---以及注意的问题(死锁)

    从python2.4版本开始,可以用subprocess这个模块来产生子进程,并连接到子进程的标准输入/输出/错误中去,还可以得到子进程的返回值. subprocess意在替代其他几个老的模块或者函数 ...

随机推荐

  1. luogu P1447 [NOI2010]能量采集 欧拉反演

    题面 题目要我们求的东西可以化为: \[\sum_{i=1}^{n}\sum_{j=1}^{m}2*gcd(i,j)-1\] \[-nm+2\sum_{i=1}^{n}\sum_{j=1}^{m}gc ...

  2. Eureka 的高级使用

    基础架构Eureka架构中的三个核心角色: 服务注册中心 Eureka的服务端应用,提供服务注册和发现功能,就是刚刚我们建立的eureka-demo 服务提供者 提供服务的应用,可以是SpringBo ...

  3. 咏南跨平台中间件REST API

    主旨 1)为了中间件支持跨操作系统部署,客户端支持跨操作系统.跨设备.跨开发语言,特制订本REST API规约. 2)所有接口均支持HTTP GET\POST调用. 3)调用示例为DELPHI代码,其 ...

  4. arcpy地理处理工具案例教程-景观形状指数计算

    arcpy地理处理工具案例教程-景观形状指数计算 商务合作,科技咨询,版权转让:向日葵,135-4855_4328,xiexiaokui#qq.com 使用方法:输入要素类即可,其余参数均默认. 商务 ...

  5. 华为云ARM64服务器试用

    公司同事弄了个华为云的ARM64服务器,让我帮忙部署我们的服务,所以先试用了一下. 总体感觉还行,使用的CentOS系统,yum也能用,epel源也可以用.但是SCL软件集用不了. uname -a ...

  6. Octet和byte的差异(转)

    在不严谨的前提下,byte和octet都表示为8 bits,但是严格意义上来讲,octet才是严格意义上的8 bits,而历史上的byte其实可以表示为4 bits ~ 10 bits,只不过现在的计 ...

  7. 019 spring social

    1.原理 2. 3. 4.

  8. g-api notes

    目录 Q: What is GOrigin? What the meaning of parameters GMat(const GNode &n, std::size_t out) Q: h ...

  9. 什么时候会进行 SpringMVC重定向保存参数(FlashMap)?

    SpringMVC重定向保存参数(FlashMap):两种情况会保存参数:    1. 当前视图为RedirectView,也即是说当前请求为重定向请求.        org.springframe ...

  10. js---用对象来放置变量和方法

    在写JS的时候,可以考虑使用对象来放置命名的变量,以及常用的方法. 简单示例: var func = { name:'张三', showName:function(name){ console.log ...