在学习vue2.0时，关于处理v-for键值顺序时发现的问题：

<body>

    <!-- 普通循环 -->

    <!-- {{num}} -->

    <!-- 列表循环 -->

    <div id="itany">

    <ul>

        <!-- name,value对应的是value name 但是在显示时则是name value -->

        <li v-for = "(name,value) in user">{{value}}-{{name}}</li>

    </ul>

    </div>

</body>

<script>

    window.onload = function(){

        new Vue({

            el:'#itany',

            data:{

                num:[12,14,25,67],

                user:{

                    id:'red',

                    age:'32',

                    class:'2',

                }

            }

        });

    }

</script>

</html>

不管是用

<li v-for = "(value,name) in user">{{name}}-{{value}}</li>
还是说用
<li v-for = "(name,value) in user">{{value}}-{{name}}</li>

所输出的结果都是如下：

而使用
<li v-for = "(value,name) in user">{{value}}-{{name}}</li>
<li v-for = "(name,value) in user">{{name}}-{{value}}</li>
则会出现如下结果：
希望该博客对你有帮助！

关于vue中v-for的键值顺序的更多相关文章

  1. Vue中父子组件执行的先后顺序

    Vera   Vue中父子组件执行的先后顺序探讨(转载) 前几天,朋友向我提出了一个关于Vue中父子组件执行的先后顺序问题,相信很多朋友在学习的过程中也会遇到这个问题,所以我就在此提出我自己的一些小看 ...

  2. Vue中父子组件执行的先后顺序探讨

    前几天,朋友向我提出了一个关于Vue中父子组件执行的先后顺序问题,相信很多朋友在学习的过程中也会遇到这个问题,所以我就在此提出我自己的一些小看法. 问题如下:请问下图中父子组件执行的先后顺序? 首先, ...

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

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

  4. 【转】kubernetes 中 deployment 支持哪些键值

    这个比较全,可以参考 ================= https://www.addops.cn/post/kubernetes-deployment-fileds.html ========== ...

  5. Map泛型集合-国家中文和英文的键值映射

    package collection; import java.util.HashMap; import java.util.Map; public class Test5 { public stat ...

  6. JDK6中System.getProperties返回键值说明

    JDK6中java.lang.System.getProperties()方法返回键值说明. 键 相关值的描述 java.version Java 运行时环境版本 java.vendor Java 运 ...

  7. JS001. antd vue遍历setFieldsValue表单键值对无效 ( {} -> new Object() )

    问题代码: const tempFieldsValue = this.form.getFieldsValue() Object.keys(tempFieldsValue).map((k) => ...

  8. （转载）php 合并数组中的数据,如果键值相等其值相加

    (转载)http://hi.baidu.com/syxrrrr/item/7dfb2387343ce0874414cfdd /* * 合并数据,如果键值相等其值相加 * @param array $d ...

  9. Vue中如何监控某个属性值的变化？

    比如现在需要监控data中, obj.a 的变化.Vue中监控对象属性的变化你可以这样: deep属性表示深层遍历,但是这么写会监控obj的所有属性变化,并不是我们想要的效果,所以做点修改: 还有一种 ...

随机推荐

  1. 单循环链表（基于c语言）

    #include <stdio.h> #include <stdlib.h> #include <assert.h> typedef int LDataType; ...

  2. PCI协议 总结

    1.引脚 必要的引脚在左边,任选的引脚在右边 2.CLK in:时钟输入,为所有PCI上的接口传送提供时序.其频率也称为PCI的工作频率. 大部分信号都在CLK的上升沿有效 3.AD0~AD31 t/ ...

  3. bzoj3144 [HNOI2013]切糕(最小割)

    bzoj3144 [HNOI2013]切糕(最小割) bzoj Luogu 题面描述见上 题解时间 一开始我真就把这玩意所说的切面当成了平面来做的 事实上只是说相邻的切点高度差都不超过 $ d $ 对 ...

  4. PCIe Tandem PROM 方法

    PCIe Tandem PROM 方法 什么是Tandem PROM? 简单总结:市面多数的FPGA都是SRAM型,需要在上电时从外部存储器件完成代码的加载,对于具有PCIe功能的SRAM FPGA而 ...

  5. MAVEN setting文件

    <?xml version="1.0" encoding="UTF-8"?> <settings xmlns="http://mav ...

  6. Java中的list和set有什么区别

    list与set方法的区别有:list可以允许重复对象和插入多个null值,而set不允许:list容器是有序的,而set容器是无序的等等 Java中的集合共包含三大类,它们分别是Set(集),Lis ...

  7. ClassLoader如何加载class ？

    jvm里有多个类加载,每个类加载可以负责加载特定位置的类,例如,bootstrap类加载负责加载jre/lib/rt.jar中的类, 我们平时用的jdk中的类都位于rt.jar中.extclasslo ...

  8. jQuery--筛选【查找函数】

    查找函数介绍 <A> <B> <C></C> <D></D> <E></E> <F>< ...

  9. 学习Keepalived（三）

    1.1Keepalived高可用软件 Keepalived起初是专为LVS设计的,专门用来监控LVS集群系统中各个服务节点的状态,后来又加入了VRRP的功能,因此除了配合LVS服务外,也可以作为其他服 ...

  10. resion 学习笔记

    resin是一个非常流行的web引用服务器,对servlet和jsp提供了良好的支持,自身采用java开发,支持集群,还支持PHP. resin分为普通版和专业版,主要区别是专业版支持缓存和负载均衡. ...