工作265:v-model实现原理 自定义组件使用v-model

v-model只是一个语法糖,等于:value+@input,真正的实现靠的还是: v-bind:绑定响应式数据,触发 input 事件并传递数据 (核心和重点)

1

其实和下面一样的

<input :value=“something” @input=“something = $event.target.value”>

1

因此,对于一个带有 v-model 的输入框组件,它应该:接收一个 value prop,触发 input 事件,并传入新值

自定义myInput组件

在页面使用

{{name}} {{othername}}

methods:{
}
}

效果
在这里插入图片描述总结:
自定义的组件内部一般包含原生的表单组件(当然非表单的组件也可以),然后给原生控件绑定事件,捕捉到原生组件的值,利用 $emit方法,触发input方法,组件监听到 input事件然后把值传入

v-model 在内部为不同的输入元素使用不同的属性并抛出不同的事件:
text 和 textarea 元素使用 value 属性和 input 事件;
checkbox 和 radio 使用 checked 属性和 change 事件;
select 字段将 value 作为 prop 并将 change 作为事件。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/414281.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

idea中隐藏.iml文件

在创建父子工程或者聚合工程时产生的大量 .iml 文件&#xff0c;有时会对我们的操作产生干扰&#xff0c;所以&#xff0c;一般情况下&#xff0c;我们都将其隐藏掉&#xff0c;步骤如下&#xff1a; File——>settings——>Editor——>File Types——>Ignore fil…

微信小程序视频弹幕效果

这次&#xff0c;和大家一起探讨下小程序视频弹幕一、按照老规矩&#xff0c;先附上gif效果图&#xff1a;二、接下来看下官方文档API对vide说明PS&#xff1a;相关属性解析&#xff1a;danmu-list:弹幕列表 enable-danmu:是否显示弹幕 danmu-btn:弹幕按钮 controls:是否显示视…

基于Docker搭建GitLab代码管理

关于Git、SVN的优缺点就不再重复了&#xff0c;本篇主要以实际搭建为主。 1、下载镜像文件 在命令行窗口执行如下指令&#xff0c;预计下载完成4分钟。 docker pull beginor/gitlab-ce:11.0.1-ce.0注意&#xff1a; 一定要配置镜像加速&#xff0c;不然会非常非常的慢&#x…

CentOS 7安装Hadoop 3.0.0

最近在学习大数据&#xff0c;需要安装Hadoop&#xff0c;自己弄了好久&#xff0c;最后终于弄好了。网上也有很多文章关于安装Hadoop的&#xff0c;但总会遇到一些问题&#xff0c;所以把在CentOS 7安装Hadoop 3.0.0的整个过程记录下来&#xff0c;有什么不对的地方大家可以留…

Docker中Maven私服的搭建

为何用到Maven私服&#xff1f; 在实际开发中&#xff0c;项目中可能会用到第三方的jar、内部通讯的服务接口都会打入到公司的私服中。 我们从项目实际开发来看&#xff1a; 一些无法从外部仓库下载的构件&#xff0c;例如内部的项目还能部署到私服上&#xff0c;以便供其他依赖…

博客作业03--栈和队列

1.学习总结 2.PTA实验作业 题目1&#xff1a;jmu-字符串是否对称 1设计思路 for i 1 to 字符串str结束if 栈顶元素 ! str[i] 字符串不对称输出noendfor字符串对称输出yes 2代码截图 3PTA提交列表说明 前面几处错误都是因为输入用的是getchar(),后来改用gets就对了好像是因为这…

apollo报:系统出错,请重试或联系系统负责人

说明&#xff1a;基于 docker 搭建的 apollo&#xff0c;创建项目后一直报系统出错&#xff0c;请重试或联系系统负责人错误。 项目人员列表一直空白&#xff1a; 经排查是数据库配置参数不匹配&#xff0c;由于自己的虚拟机 ip 为 192.168.10.130 注意&#xff1a;修改完需要重…

关于Trie的一些算法

最近学习了一下关于Trie的一些姿势&#xff0c;感觉很实用。 终于不用每次看到字符串判重等操作就只想到hash了 关于Trie的定义&#xff0c;来自百度百科 在计算机科学中&#xff0c;Trie&#xff0c;又称前缀树或字典树&#xff0c;是一种有序树状的数据结构&#xff0c;用于保…

使用nginx搭建https服务器

最近在研究nginx&#xff0c;整好遇到一个需求就是希望服务器与客户端之间传输内容是加密的&#xff0c;防止中间监听泄露信息&#xff0c;但是去证书服务商那边申请证书又不合算&#xff0c;因为访问服务器的都是内部人士&#xff0c;所以自己给自己颁发证书&#xff0c;忽略掉…

分布式配置中心阿波罗的搭建与客户端的应用

为了统一管理微服务配置文件&#xff0c;实现动态化刷新配置文件&#xff0c;常见的两种方式为阿波罗、SpringCloudConfig&#xff0c;关于两者主要区别是&#xff1a; 阿波罗配置文件存放在数据库中&#xff0c;SpringCloudConfig存放在Git里面 一、搭建过程 本篇主要演示阿波…

PHP攻击防御

原文地址 有个朋友网站被攻击&#xff0c;刚好我们的网站有比较全面的攻击防御&#xff0c;了解了一下自己网站的防御&#xff0c;再上网搜了一些文章来看&#xff0c;觉得上面的文章写得很全面&#xff0c;特此备份。留着以后自己忘记的时候看看。

毕业一年的大专生程序员工作总结(java后台)

文章导读 一、回眸过去 – 闲扯的话 – 零碎的技术二、经验总结 – 沟通交流 – 贵在坚持 – 合理规划三、展望未来 – 积累行业背景 – 学习清单四、最后补充 一、 回牟过去 1、闲扯的话 大专生毕业一年工作总结&#xff0c;谈不上予人借鉴&#xff0c;算是对自己过去一年…

mysql自带加密解密字符集问题

由于公司业务需要&#xff0c;需要对已有的数据进行加密&#xff0c; 由于数据加密之后需要可逆的解密&#xff0c;最先考虑使用encode&#xff0c;decode函数&#xff1b;在实际使用的过程遇到加密数据解密之后得不到原本的值&#xff0c;后发现是由于字符集不正确&#xff0c…

重温类加载机制

前言 我们在学习 java 基础的时候&#xff0c;从宏观上了解一个类到运行大致是&#xff1a;.java 文件通过 javac 编译器编译得到 .class 文件&#xff0c;在用到该类时&#xff0c;jvm 会加载该 class 文件&#xff0c;并创建对应的 class 对象&#xff0c;将 class 文件加载…