<!DOCTYPE html>

<html>

	<head>

		<meta charset="UTF-8">

		<title>变异方法push的留言版实例讲解</title>

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

	</head>

	<body>

		<div id="lantian">

			<li v-for="v in comments">

				{{v.content}}

			</li>

			<textarea v-model="current_content" rows="10" cols="50"></textarea><br />

			<button v-on:click="push">提交</button>

		</div>

		<script>

			var app=new Vue({

			el:'#lantian',

			data:{

				current_content:'',

				comments:[

					{content:'小二'},

					{content:'小三'}

				]

			},

			methods:{

				push(){

					var content={content:this.current_content};

					this.comments.push(content);

					this.current_content='';

				}

			}

		});

		</script>

	</body>

</html>

　　

020——VUE中变异方法push的留言版实例讲解的更多相关文章

  1. 20.VUE学习之-变异方法push的留言版实例讲解

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. Vue 变异方法Push的留言板实例

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. 021——VUE中变异方法 push/unshift pop/shift

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. vue数组变异方法

    Vue数组变异方法,会改变被这些方法调用的原始数组,将会触发视图更新 push() 接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度 pop() 从数组末尾移除最后一项,减少数组的 ...

  5. 022——VUE中remove()方法的使用：

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. Vue中this.$router.push（参数） 实现页面跳转

    很多情况下,我们在执行点击按钮跳转页面之前还会执行一系列方法,这时可以使用 this.$router.push(location) 来修改 url,完成跳转. push 后面可以是对象,也可以是字符串 ...

  7. vue 中 this.$router.push() 路由跳转传参 及 参数接收的方法

    传递参数的方法:1.Params 由于动态路由也是传递params的,所以在 this.$router.push() 方法中 path不能和params一起使用,否则params将无效.需要用name ...

  8. Vue中this.$router.push参数获取（通过路由传参）【路由跳转的方法】

    传递参数的方法: 1.Params 由于动态路由也是传递params的,所以在 this.$router.push() 方法中 path不能和params一起使用,否则params将无效.需要用nam ...

  9. vue中this.$router.push()路由传值和获取的两种常见方法

    1.路由传值   this.$router.push() (1) 路由跳转使用router.push()方法,这个方法会向history栈添加一个新纪录,所以,当用户点击浏览器后退按钮时,会回到之前的 ...

随机推荐

  1. 这几天添加ccbi 出现的问题

    父类是一个ccbi...在父类的onNodeLoaded 里面添加子类的ccbi ... 出现了父类为空的情况...获取不到时间轴..动画为空... 需要在父类的onEnter里面写添加子类的ccbi ...

  2. JVM内存区域划分Eden Space\Survivor Space\Tenured Gen\Perm Gen

    JVM区域分heap区和非heap区. 1)heap区:Eden Space(伊甸园),Survivor Space(幸存者区),Tenured Gen(老年代-养老区). 2)非heap区:Code ...

  3. shell 脚本中双引号 单引号 反引号 的区别

    转自:http://blog.csdn.net/iamlaosong/article/details/54728393 最近要编个shell脚本处理数据,需要检测数据文件是否存在,文件名中包含日期,所 ...

  4. JS正则表达式从入门到入土（8）—— REGEXP对象属性

    对象属性 常用对象属性主要有以下几种: 1.global: 是否全文搜索,默认false 2.ignore case:是否大小写敏感,默认是false 3.multiline:多行搜索,默认值是fal ...

  5. jquery试题

    1.下面哪种说法是正确的? 您的回答:jQuery 是 JavaScript 库 2.jQuery 使用 CSS 选择器来选取元素? 您的回答:正确 3.jQuery 的简写是? 您的回答:$ 符号 ...

  6. ora-12154:tns:could not resolve the connect identifier specied

    今天在发布网站时,点击登录之后出现了这个问题,修改一下环境变量,该问题就顺利解决了,解决方法如下: 在环境变量里,找到[Administrator的用户变量(U)],在其之下新建一个用户变量: 变量名 ...

  7. 20145215刘俊谦实验五 Java网络编程及安全

    实验内容 掌握Socket程序的编写: 掌握密码技术的使用: 设计安全传输系统. 实验步骤 本次实验由两人组队完成,20145321曾子誉是我本次实验的搭档,链接为:http://www.cnblog ...

  8. 20145231熊梓宏 《网络对抗》 Bof逆向基础.shellcode注入

    20145231网络对抗<逆向及Bof基础>shellcode注入 实验目的与要求 1.本次实践的对象是一个名为pwn1的linux可执行文件. 2.若该程序正常执行,则main函数会调用 ...

  9. composer安装教程 windows系统 | Linux系统 | mac系统

    如何安装 Composer 下载 Composer 安装前请务必确保已经正确安装了 PHP.打开命令行窗口并执行 php -v 查看是否正确输出版本号. 打开命令行并依次执行下列命令安装最新版本的 C ...

  10. Covariance and Contravariance (C#)

    Covariance and Contravariance (C#) https://docs.microsoft.com/en-us/dotnet/articles/csharp/programmi ...