(1)

等价于:

其中$event.target.value表示获取输入框的值。
(2)当用在组件上时,v-model 则会这样:

其中$event表示$emit抛出的值,即$emit的第二个参数。
(3)将(2)写成代码为:
Vue.component('custom-input', {
props: ['value'],
template: ‘
<input
v-bind:value="value" //"value"对应props里面的value
v-on:input="$emit('input', $event.target.value)"
>

})
使用方式:

在组件上使用v-model的更多相关文章

  1. 组件上使用v-model

    组件上使用v-model <input v-model="searchText"> 等价于 <input v-bind:value="searchTex ...

  2. vue 学习六 在组件上使用v-model

    其实这个部分应该是属于component,为什么把这玩意单独拿出来呢,原因是它这个东西比较涉及到了vue的事件,以及v-model指令的使用,还是比较综合的.所以就拿出来啦 父组件 <templ ...

  3. 使用commons-fileUpload组件上传文件

    在近期的一个项目中有用到commons-fileUpload组件进行实现文件上传的功能(由于没用到框架),在使用的过程中有遇到一些问题,经过自己的琢磨也算顺利地将其解决了,在这里做个记录. 一.com ...

  4. asp 文件上传(ASPUpload组件上传)

    要实现该功能,就要利用一些特制的文件上传组件.文件上传组件网页非常多,这里介绍国际上非常有名的ASPUpload组件 1 下载和安装ASPUpload   要实现该功能,就要利用一些特制的文件上传组件 ...

  5. EasyUI 关于IE使用window组件上传文件

    有时候IE会对使用window组件上传文件(第二次)不生效,解决方案是: 将该window每次打开的时候,使用: $('#adUploadWindow').window('refresh', 'pan ...

  6. 前台利用jcrop做头像选择预览,后台通过django利用Uploadify组件上传图最终使用PIL做图像裁切

    之前一直使用python的PIL自定义裁切图片,今天有需求需要做一个前端的选择预览页面,索性就把这个功能整理一下,分享给大家. 实现思路: 1.前端页面: 用户选择本地一张图片,然后通过鼠标缩放和移动 ...

  7. django Form组件 上传文件

    上传文件 注意:FORM表单提交文件要有一个参数enctype="multipart/form-data" 普通上传: urls: url(r'^f1/',views.f1), u ...

  8. vue里在自定义的组件上定义的事件

    事件分为原生事件和自定义事件. vue里在自定义的组件上定义的事件,都被认为是自定义事件,必须用$emit()来触发. 这也是子组件向父传值的原理. 如果想作为原生事件,需要在原生事件后面加上.nat ...

  9. vue2进阶之v-model在组件上的使用

    v-model 用在 input 元素上时 v-model虽然很像使用了双向数据绑定的 Angular 的 ng-model,但是 Vue 是单项数据流,v-model 只是语法糖而已: <in ...

  10. C后端设计开发 - 第6章-武技-常见组件上三路

    正文 第6章-武技-常见组件上三路 后记 如果有错误, 欢迎指正. 有好的补充, 和疑问欢迎交流, 一块提高. 在此谢谢大家了.

随机推荐

  1. 基于图的异常检测(三):GraphRAD

    基于图的异常检测(三):GraphRAD 风浪 一个快乐的数据玩家/风控/图挖掘 24 人赞同了该文章 论文:<GraphRAD: A Graph-based Risky Account Det ...

  2. Linux终端执行shell脚本,提示权限不够

    在学习dubbo过程中,上传自己写的脚本,执行的时候提示“权限不够”,从网上了解到是因为没有为脚本赋权限 解决方法是使用chmod命令为shell脚本赋予权限 chmod 777 ./service- ...

  3. 代码审计-strcmp比较字符串

    <?php $flag = "flag{xxxxx}"; if (isset($_GET['a'])) { if (strcmp($_GET['a'], $flag) == ...

  4. IDEA写vue项目出现红色波浪线警告如何解决??

    1.看图 2.希望对大家有帮助,只要修改了这个就可以,如有任何问题都可以留言,谢谢大家 2019-09-1923:54:11 作者:何秀好

  5. 【使用篇二】SpringBoot整合Filter(2)

    两种方式: 通过注解扫描完成 Filter 组件的注册 通过方法完成 Filter 组件的注册 一.通过注解扫描完成 Filter 组件的注册 1. 编写Filter类 /** * SpringBoo ...

  6. springsecurity的http.permitall与web.ignoring的区别

    permitAll配置实例 @EnableWebSecurity public class SecurityConfig extends WebSecurityConfigurerAdapter { ...

  7. postgres 字符操作补位,字符切割

    补位: ,'); -- 字符切割 并取值: )

  8. NLP之预训练

    内容是结合:https://zhuanlan.zhihu.com/p/49271699 可以直接看原文 预训练一般要从图像处理领域说起:可以先用某个训练集合比如训练集合A或者训练集合B对这个网络进行预 ...

  9. A1033 To Fill or Not to Fill (25 分)

    一.技术总结 是贪心算法的题目,题目主要考虑的问题有几个,是否会在第一个加油站的最近距离大于0,如果是这样那么直接输出答案,因为初始油箱没有汽油: 第二个是如何选定加油站,如果在可到达距离范围类,我们 ...

  10. [LeetCode] 212. Word Search II 词语搜索之二

    Given a 2D board and a list of words from the dictionary, find all words in the board. Each word mus ...