在学习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. TP5框架中实现多条件登录

    控制器代码 //登录功能 public function login(){ $data = input(); $validate = $this->validate($data,[ 'uname ...

  2. laravel报错 : No application encryption key has been specified.

    创建了新的laravel项目后, 运行提示:No application encryption key has been specified 解决方法: 这个是由于没有配置好 APP_KEY 在终端上 ...

  3. 微信公众号客服接口：out of response count limit 的原因

    调用客服消息接口返回如下:                                                                                       ...

  4. MYSQL数年库安装

    MySQL系列 MySQL 的三大主要分支mysqlmariadbpercona Server MySQL系列2.2.2.1 MySQL 的三大主要分支mysqlmariadbpercona Serv ...

  5. 「科技」在线 O(1) 逆元

    问题:固定模数 \(p\),多次回答某个数 \(a\) 的逆元.强制在线. 本文提供一个 \(O(p^{\frac{2}{3}})\) 预处理,\(O(1)\) 查询的做法. 首先定义一下 Farey ...

  6. IIS 虚拟目录 VS 站点

    1.虚拟目录是站点的一个子目录,虚拟目录是建立在站点下面的. 2.一个站点下面,可以建立多个虚拟目录.各个虚拟目录都是以虚拟目录名称来进行区分. 3.新建的独立站点就和IIS中的默认站点一样,各个站点 ...

  7. For循环案例练习一基础版

    输出1-10之间的数据 1 public class LX1 { 2 public static void main(String[] args) { 3 for (int x=1;x<=10; ...

  8. CF 920A Water The Garden

    本题可以看做是一个数学题 因为 在第 1 和第 3 个洒水器之间的 花园灌溉的时间只要 (1 + 3 ) >> 1 - 1 + 1;//这么长的时间 那么我么就可以以此类推到 从而我么可以 ...

  9. Charles的安装及设置

    1. Charles的安装 l  下载安装包 l  安装:按照提示信息一步步安装,不做多余解释 l  破解:将Charles.jar包放在安装目录,如D:\Program Files\Charles\ ...

  10. 解释基于XML Schema方式的切面实现？

    在这种情况下,切面由常规类以及基于XML的配置实现.