文档章节

Vue.js学习系列(二十)--常用指令(三)

博为峰教研组
 博为峰教研组
发布于 2017/03/15 18:42
字数 203
阅读 53
收藏 1

3.v-model实现双向绑定

指令用于表单元素上,例如常见的input,select,textarea,radio,

checkbox等。,所谓双向绑定,指的就是我们在js中的vue实例中的

data与其渲染的dom元素上的内容保持一致,两者无论谁被改变,

另一方也会相应的更新为相同的数据。这是通过设置属性访问器实现的

示例:

在 input 输入框中我们可以使用 v-model 指令来实现双向数据绑定:

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Document</title>

<script src="src/vue.min.js"></script>

</head>

<body>

<div id="app">

<p>{{message}}</p>

<input v-model="message">

</div>

<script type="text/javascript">

new  Vue({

el:"#app",

data:{

message:"姓名"

}

})

</script>

</body>

</html>


 

在p标签的内容,也显示在文本框中

 

© 著作权归作者所有

博为峰教研组
粉丝 51
博文 1224
码字总数 479077
作品 0
黄浦
程序员
私信 提问
Vue 全站缓存之 vue-router-then :前后页数据传递

连续预告了好几天,总算写到这篇了。 系列篇1:Vue 全站缓存之 keep-alive : 动态移除缓存 系列篇2:Vue 全站缓存二:如何设计全站缓存 本篇为系列篇3:Vue 全站缓存之 vue-router-then :前...

wanyaxing
2018/08/02
0
0
Vue新手向:14篇教程带你从零撸一个Todo应用

欢迎来到 Vue2.x Todo 系列教程,这个教程将手把手教你从零开始使用 Vue 搭建一个 Todo(待办事项)应用。 书写此教程的动机 Vue 作者尤雨溪在 新手向:Vue 2.0 的建议学习顺序 中给出了中肯...

追梦人物
01/16
0
0
2018 我所了解的 Vue 知识大全

年初第一个 flag 就是掌握 vue ,哈哈! Vue ,React ,Angular 三大主流框架,最后我选择学习 Vue ,接触过 React ,自己感觉学习曲线有些陡峭,进而我选择了学习 Vue ,他的学习曲线平稳很...

cacao111
2018/07/11
0
0
.NET Core实战项目之CMS 第六章 入门篇-Vue的快速入门及其使用

写在前面 上面文章我给大家介绍了Dapper这个ORM框架的简单使用,大伙会用了嘛!本来今天这篇文章是要讲Vue的快速入门的,原因是想在后面的文章中使用Vue进行这个CMS系统的后台管理界面的实现...

依乐祝
2018/11/28
0
0
Vue 系列一 之 Vue 基础

Create by jsliang on 2018-11-8 13:34:30 Recently revised in 2019-1-12 19:23:17 Hello 小伙伴们,如果觉得本文还不错,记得给个 star , 你们的 star 是我学习的动力!GitHub 地址 推荐通...

jsliang
01/14
0
0

没有更多内容

加载失败,请刷新页面

加载更多

IT兄弟连 HTML5教程 HTML5表单 新增的表单属性1

HTML5 Input表单为<form>和<input>标签添加了几个新属性,属性如表1。 1 autocomplete属性 autocomplete属性规定form或input域应该拥有自动完成功能,当用户在自动完成域中开始输入时,浏览器...

老码农的一亩三分地
37分钟前
5
0
OSChina 周五乱弹 —— 葛优理论+1

Osc乱弹歌单(2019)请戳(这里) 【今日歌曲】 @这次装个文艺青年吧 :#今日歌曲推荐# 分享米津玄師的单曲《LOSER》: mv中的舞蹈诡异却又美丽,如此随性怕是难再跳出第二次…… 《LOSER》-...

小小编辑
今天
990
16
nginx学习笔记

中间件位于客户机/ 服务器的操作系统之上,管理计算机资源和网络通讯。 是连接两个独立应用程序或独立系统的软件。 web请求通过中间件可以直接调用操作系统,也可以经过中间件把请求分发到多...

码农实战
今天
5
0
Spring Security 实战干货:玩转自定义登录

1. 前言 前面的关于 Spring Security 相关的文章只是一个预热。为了接下来更好的实战,如果你错过了请从 Spring Security 实战系列 开始。安全访问的第一步就是认证(Authentication),认证...

码农小胖哥
今天
15
0
JAVA 实现雪花算法生成唯一订单号工具类

import lombok.SneakyThrows;import lombok.extern.slf4j.Slf4j;import java.util.Calendar;/** * Default distributed primary key generator. * * <p> * Use snowflake......

huangkejie
昨天
18
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部