在学习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. SQL从零到迅速精通【数据更新】

    1.[导入表]在两个表的格式一样的情况下,将一个表的数据导入另外一个表. person_old表中现在有两条记录.接下来将person_old表中所有的记录插入到person表中,语句如下: INSE ...

  2. L2Dwidget二次元前端添加人物插件

    如果想要在博客园上添加这个插件,只需要在设置的"页首html代码"中添加下面的js就行 <!-- 右下角live2d效果 --> <script src=&quo ...

  3. CA周记 2022年的第一课 - Rust

    现代编程语言有很多,在我的编程学习里面有小学阶段的 LOGO , 中学阶段的 Pascal ,也有大学阶段的 C/C++.Java..NET,再到工作的 Objective-C .Swift.Go.K ...

  4. vue3-码一下组件的v-model

    RT,码一下组件的v-model,知识点太多,没听懂...,后面学完回来再仔细看看

  5. XML解析与文件存取

    using System; using System.IO; using System.Text; using System.Xml; namespace XMLDemo { class Progra ...

  6. 所有整数型包装类对象值的比较，使用equals方法进行比较

    一.整数型包装类对象值的比较,使用equals方法进行比较 题眼:整型包装类.值的比较 注:== :对于基本类型,比较的是值:对于引用类型,比较的是地址值. // 组一Integer i1=new I ...

  7. 5分钟了解Redis的内部实现快速列表（quicklist）

    快速列表简介 在Redis3 .2版本之前,存储列表(list)数据结构使用的是压缩列表(ziplist)和链表(linkedlist),当列表元素个数比较少并且每个元素占用空间比较小的时候,使用压缩 ...

  8. 了解Redis持久化

    Redis是一个键值对数据库服务器,由于Redis是内存数据库,那么有很多内存的特点,例如掉电易失,或者进程退出,服务器中的数据也将消失不见,所以需要一种方法将数据从内存中写到磁盘,这一过程称之为数据 ...

  9. linux 下载源

    Cenos7 Nginx [nginx-stable]name=nginx stable repobaseurl=http://nginx.org/packages/centos/$releaseve ...

  10. 6月20日 Django中ORM介绍和字段、字段参数、相关操作

    一.Django中ORM介绍和字段及字段参数 二.Django ORM 常用字段和参数 三.Django ORM执行原生SQL.在Python脚本中调用Django环境.Django终端打印SQL语句 ...