<!DOCTYPE html>

<html>

	<head>

		<meta charset="UTF-8">

		<title>v-for操作对象与数值</title>

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

	</head>

	<body>

		<!--v-for操作对象-->

		<div id="lantian">

			<li v-for="(item,key,index) in user">

				{{index}}——{{key}}——{{item}}

			</li>

			<!--v-for操作数值-->

			<table border="1" width="100%">

				<tr v-for="v in 20">

					<td>{{v}}</td>

				</tr>

			</table>

		</div>

		<script>

			var app = new Vue({

				el: '#lantian',

				data: {

					user: {

						name: '小明',

						age: '22',

						sex: 'boy'

					}

				}

			});

		</script>

	</body>

</html>

　　

018——VUE中v-for操作对象与数值的更多相关文章

  1. 18.VUE学习之-v-for操作对象与数值

    一组数组时的循环 二组数组时的循环 另外可以v for 20 可以直接操作数字 <!DOCTYPE html> <html lang="en"> <h ...

  2. Vue v-for操作对象与数值

    <!doctype html> <html lang="en"> <head id="head"> <meta cha ...

  3. [记录] Vue中的dom操作

    使用过Vue的同学都应该有这样一个感觉,在vue中页面是基于数据驱动的,不需要我们自己操作dom,框架帮我们完成了这一步,事实上Vue官方也建议我们这样做 在绝大多数情况下是不需要操作dom就可以完成 ...

  4. vue中如何使用event对象

    原文地址 一.event 对象 (一)事件的 event 对象 你说你是搞前端的,那么你肯定就知道事件,知道事件,你就肯定知道 event 对象吧?各种的库.框架多少都有针对 event 对象的处理. ...

  5. vue 中的translation操作----动态值

    在vue中,也会遇见translate的情况,这里顺带也可以带上如何查找页面中的元素的案例. 1.在加载过程中,有会遇见加载顺序先后的问题,然后查找页面元素null的情况,所以在mounted的钩子函 ...

  6. 原生js中获取this与鼠标对象以及vue中默认的鼠标对象参数

    1.通过原生js获取this对象 <!DOCTYPE html> <html> <head> <meta charset="utf-8" ...

  7. Vue中可用的判断对象是否为空的方法

    vue有两个方法可用 1. JSON.stringify(evtValue)=='{}' 2. Object.keys(xxx).length==0 js判断对象是否为空对象的几种方法 1.将json ...

  8. Vue中的DOM操作

    1.在要获取的标签中添加 ref="xx" 示例: <button ref="btn">一个按钮</button> 2.在 mounte ...

  9. vue中改变数组或对象，页面没做出对应的渲染

    原文链接 数组更新检测 变异方法 Vue 包含一组观察数组的变异方法,所以它们也将会触发视图更新.这些方法如下: push() pop() shift() unshift() splice() sor ...

随机推荐

  1. HDU - 5909 Tree Cutting (树形dp+FWT优化)

    题意:树上每个节点有权值,定义一棵树的权值为所有节点权值异或的值.求一棵树中,连通子树值为[0,m)的个数. 分析: 设\(dp[i][j]\)为根为i,值为j的子树的个数. 则\(dp[i][j\o ...

  2. asp.net时间显示

    DateTime dt = DateTime.Now;//    Label1.Text = dt.ToString();//2005-11-5 13:21:25//    Label2.Text = ...

  3. Spring 实现数据隔离

    需求 用户数据要同时支持在mysql和redis进行管理.存储. 思路 利用spring的注解,在配置中指定存储类型,启动时识别并选择对应的实现类. 代码 1. 用户管理的接口类 public int ...

  4. Unity状态机的实现，以《塔防》为例

    什么是有限状态机? 通俗点讲,有限状态机是:将对象的状态(攻击.闲置.晕眩)的实现代码,提取出来,封装成状态.由状态机负责在各个状态之间调度. 对象持有状态管理类(状态机)的引用,与具体的状态解耦. ...

  5. vue下载文件

    import fileDownload from 'js-file-download' let params = { ", ", "filename":&quo ...

  6. Redis学习笔记之Redis中5种数据结构的使用场景介绍

    原来看过 redisbook 这本书,对 redis 的基本功能都已经熟悉了,从上周开始看 redis 的源码.目前目标是吃透 redis 的数据结构.我们都知道,在 redis 中一共有5种数据结构 ...

  7. cordova linux 安装并编出第一个demo-android

    cordova可以做到一次编写到处运行各个平台(android.ios.wp.bb.firefoxos.web等几乎所有平台) 手上只有一个android手机 ,安装的时候没有那么顺利,第一大问题就是 ...

  8. 20145324Java课程总结

    20145324课程总结 ●每周读书笔记链接总汇 [第一周](http://www.cnblogs.com/SJZGM10/p/5246770.html) 第二周(不小心删了) [第三周](http: ...

  9. 20145329《Java程序设计》第六周学习总结

    教材学习内容总结 第十章 InputSream与OutputStream Java中,输入串流代表对象为java.io.InputStream实例,输出串流代表对象为java.io.OutputStr ...

  10. Package Manager Console的使用

    Find-Package PM> Find-Package autofac https://docs.microsoft.com/en-us/nuget/tools/ps-ref-find-pa ...