v-model、v-bind和v-on三大指令的区别

优质创作者: 编程框架技术领域

2022-08-27 21:10:34

1.v-model用来进行data数据与页面数据的双向绑定。主要用于表单控件，被称为双向绑定
2.v-bind是data数据对页面标签中属性的绑定。被称为单向绑定
3.v-on是methods对页面事件的绑定。

https://blog.csdn.net/qq_46285118/article/details/126549565?spm=1001.2014.3001.5501

...全文

282 1 打赏收藏转发到动态举报

写回复

1 条回复

切换为时间正序

请发表友善的回复…

发表回复

CSDN-Ada助手 2023-01-13

打赏
举报

回复

您可以前往 CSDN问答-其他发布问题, 以便更快地解决您的疑问

Vue.js 的各种指令（Directives）更加方便我们去数据驱动 DOM，例如 v-bind、v-on、v-model、v-if、v-for、v-once 等内置指令，这些指令的职责就是当表达式改变时将某些行为应用到 DOM 上，尽量不去操作增删改 DOM。通过了解如何去自定义指令，可以想象内置指令是如何完成的。内置指令指令名称描述使用 v-model 绑定数据 <\input v-model=”message”> v-text 输出文本,不能解析标签 <\p v-text=”message”> v-html 输出文本,可解析标签 <\p v-ht

越来越多的人在用Vue，刚开始接触vue的话常接触的指令就几个，统一归纳一下，做个demo演示。指令 v-text v-html v-bind v-on v-model v-for 代码学习技术最好还是要看下代码是什么样的。 v-text 解释：更新DOM对象的 textContent

v-html 解释：更新DOM对象的 innerHTML

v-bind 作用：当表达式的值改变时，将其产生的连带影响，响应式地作用于 DOM 语法： v-bind:title=msg // 简写：:tit

本文为大家介绍了VUE中内置指令包括：v-text,v-html,v-show,v-if,v-else,v-else-if,v-for,v-on,v-bind,v-model,v-pre,v-cloak,v-once

Vue基础知识处理数据访问实例数据方法指令双向数据绑定绑定属性输出原始HTML 听事件通过事件传递数据事件修饰符键盘事件和修饰符绑定属性使用指令：v-bind v-bind指令的简写：在属性前面添加冒号；例如v-bind：href->：href 听事件使用指令：v-on：name_of_event v-on指令的简写：在事件名称前添加@（通常是无效属性）；例如v-on：click-> @click v-model指令是Vue中绑定和使用事件的组合。从技术上讲，以下两者都在做相同的事情。 v模型是一种语法糖，用于绑定到值，并侦听更改以更新数据。 First Name <input type="text" v-model="firstName" /> Last Name <input type=

项demo中基本用到所有Vue的基本功能,比如,双向绑定,渲染列表,数据绑定,组件,自定义指令,消息传递,条件渲染等,运行方法见 readme

158

社区成员

200

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章