首页 > 其他分享 >vue v-bind与v-model的区别

vue v-bind与v-model的区别

时间:2023-05-06 16:12:04浏览次数:36  
标签:vue bind 绑定 流向 model data 页面

1.v-bind是单向绑定,用来绑定数据和属性以及表达式,数据只能从data流向页面;v-model是双向绑定,数据能从data流向页面,也能从页面流向data。
2.v-bind可以给任何属性赋值,v-model只能给表单类,也就是具有value属性的元素进行数据双向绑定,如input、text、radio、checkbox、selected。
可以这么理解,页面流向data,v-model是捕获用户的输入值,如果没有value,捕获不了,所以这个流向没有意义,v-model就是收集value值。

标签:vue,bind,绑定,流向,model,data,页面
From: https://www.cnblogs.com/echo42/p/17377675.html

相关文章

  • Mac M系列芯片 vue前端node-sass兼容问题解决
    0、由于M系列芯片是arm架构,在使用brew安装node时都是arm的node,但是[email protected]版本中不支持arm架构的出现如下报错:Error:NodeSassdoesnotyetsupportyourcurrentenvironment:OSXUnsupportedarchitecture(arm64)withUnsupportedruntime(88)Formoreinfor......
  • vue思考与element-ui的代码基础
    说一下我对vue的理解在我看来vue就是对变量定义,之后把变量返回回去再由主题部分调用返回的函数,可以直接用调用的关键字而这个和CSS有一点相像与element-ui<divid="app"><!--在这放emement-ui官方给的代码--></div><scriptscr="vues.js"></script><scriptsrc="ele......
  • Vue实现计算器
    <head><metacharset="UTF-8"><title>计算器</title><!--引入Vue--><scripttype="text/javascript"src="../jquery.js"></script><scripttype="text/jav......
  • vue页面中展示markdown以及katex公式
    场景数据库中有markdown语法的字符串,需要展示为正常的页面,难点在于其中的katex数学公式解决方式使用showdown及其族系插件npmishowdownnpmishowdown-katex<template> <divclass="msg"v-html="transformMsg(msgInfo)"></div></template><script>imports......
  • vue-移动端开发-样式适配方案
    样式适配场景:一个项目中既包含了web端也包含了移动端的页面,web端的一些样式不能在移动端正常显示解决方式:npmipostcss-px-to-viewport项目目录下postcss.config.jsmodule.exports={plugins:{"postcss-px-to-viewport":{unitToConvert:"px",view......
  • VUE常见问题,持续更新
    最新接触VUE3,作为新手在使用TS语法时经常会遇到一些各种各样的问题,在些做个归纳。1.直接引用.json文件最报错TS2732:Cannotfindmodule'@/data.json'.Considerusing'--resolveJsonModule'toimportmodulewith&:在tsconfig.json中添加 "resolveJsonModule":true,......
  • Vue学习
    vue第一个案例vue.js开发版本vue.min.js生产版本(压缩版)第一个案例:<!doctypehtml><htmllang="en"><head><metacharset="UTF-8"><title>Document</title><scripttype="text/javascript"src=&q......
  • java基于springboot+vue的校园新闻网站、校园新闻管理系统,附源码+数据库+文档+PPT,适合
    1、项目介绍校园新闻网站的主要使用者分为管理员和用户,实现功能包括管理员:首页、个人中心、用户管理、新闻类型管理、校园新闻管理、留言板管理、论坛交流、系统管理,用户前台:首页、校园新闻、论坛交流、留言反馈、个人中心、后台管理等功能。由于本网站的功能模块设计比较全面,所......
  • Vue进阶(七十八):Vue 定时器与 JS 定时器
    (文章目录)<hrstyle="border:solid;width:100px;height:1px;"color=#000000size=1">一、Vue定时器在vue中,有两种定时器,一是浏览器API,window对象上的;另一种就是vue/nodejs封装的,需要引入。import{setInterval,clearInterval}from'timers'建议使用window对象自带......
  • js基础--this的作用域、函数的调用与bind高阶函数
    this的作用域箭头函数也无法通过call、apply改变this箭头函数也没有arguments函数的调用并指定this使用call调用时先指定参数this,后指定实参。。apply则是数组传递实参bind高阶函数:可以创建一个新的函数并锁死this与实参......