vue 解决遍历对象显示的顺序不对问题


Posted in Javascript onNovember 07, 2019

一、情况说明:在wacth里面生成了一个日期字符串的的数组(如下图1),如果遍历这个数组生成一个以日期为key的Object,但是数组里面的元素顺序和Object的属性的顺序是不一样的,并且在vue模板中遍历这个Object并显示key,得到的是数组的元素顺序(如下图2)!

图1

vue 解决遍历对象显示的顺序不对问题

图2

vue 解决遍历对象显示的顺序不对问题

二、过程分析:问题出在了遍历数组得到对象上,这个时候的顺序变了

vue 解决遍历对象显示的顺序不对问题

三、解决方法:先给数组排序,在遍历得到对象

vue 解决遍历对象显示的顺序不对问题

文章仅为本人学习过程的一个记录,仅供参考,如有问题,欢迎指出!

以上这篇vue 解决遍历对象显示的顺序不对问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js通过八个点 拖动改变div大小的实现方法
Mar 05 Javascript
jQuery ui 利用 datepicker插件实现开始日期(minDate)和结束日期(maxDate)
May 22 Javascript
js如何打印object对象
Oct 16 Javascript
谈谈js中的prototype及prototype属性解释和常用方法
Nov 25 Javascript
干货分享:让你分分钟学会javascript闭包
Dec 25 Javascript
AngularJS中如何使用$http对MongoLab数据表进行增删改查
Jan 23 Javascript
详解Backbone.js框架中的模型Model与其集合collection
May 05 Javascript
js实现HashTable(哈希表)的实例分析
Nov 21 Javascript
Google 爬虫如何抓取 JavaScript 的内容
Apr 07 Javascript
JavaScript模块化之使用requireJS按需加载
Apr 12 Javascript
JS实现数组去重及数组内对象去重功能示例
Feb 02 Javascript
jquery简易手风琴插件的封装
Oct 13 jQuery
vue遍历对象中的数组取值示例
Nov 07 #Javascript
浅谈v-for 和 v-if 并用时筛选条件方法
Nov 07 #Javascript
Vue2.X和Vue3.0数据响应原理变化的区别
Nov 07 #Javascript
vue 实现v-for循环回来的数据动态绑定id
Nov 07 #Javascript
vue改变循环遍历后的数据实例
Nov 07 #Javascript
vue element-ui el-date-picker限制选择时间为当天之前的代码
Nov 07 #Javascript
vue v-for直接循环数字实例
Nov 07 #Javascript
You might like
php正则表达式(regar expression)
2011/09/10 PHP
CodeIgniter中使用Smarty3基本配置
2015/06/29 PHP
自己的js工具_Form 封装
2009/08/21 Javascript
js输出列表实现代码
2010/09/12 Javascript
基于Jquery的回车成tab焦点切换效果代码(Enter To Tab )
2010/11/14 Javascript
jquery判断元素的子元素是否存在的示例代码
2014/02/04 Javascript
JavaScript function 的 length 属性使用介绍
2014/09/15 Javascript
javascript新闻跑马灯实例代码
2020/07/29 Javascript
js实现数组冒泡排序、快速排序原理
2016/03/08 Javascript
Bootstrap每天必学之折叠
2016/04/12 Javascript
js canvas实现擦除动画
2016/07/16 Javascript
基于JS如何实现给字符加千分符(65,541,694,158)
2016/08/03 Javascript
AngularJs  Understanding Angular Templates
2016/09/02 Javascript
基于MVC方式实现三级联动(JavaScript)
2017/01/23 Javascript
jQuery简单实现MD5加密的方法
2017/03/03 Javascript
javascript 中null和undefined区分和比较
2017/04/19 Javascript
JavaScript实现打印星型金字塔功能实例分析
2017/09/27 Javascript
jquery实现图片跟随鼠标的实例
2017/10/17 jQuery
浅谈webpack 自动刷新与解析
2018/04/09 Javascript
微信小程序开发之map地图组件定位并手动修改位置偏差
2019/08/17 Javascript
Python中处理时间的几种方法小结
2015/04/09 Python
用生成器来改写直接返回列表的函数方法
2017/05/25 Python
Python走楼梯问题解决方法示例
2018/07/25 Python
对pandas处理json数据的方法详解
2019/02/08 Python
Python中的几种矩阵乘法(小结)
2019/07/10 Python
Python JSON编解码方式原理详解
2020/01/20 Python
Selenium alert 弹窗处理的示例代码
2020/08/06 Python
.NET程序员的数据库面试题
2012/10/10 面试题
学生党员思想汇报
2013/12/28 职场文书
生产部统计员岗位职责
2014/01/05 职场文书
求职个人评价范文
2014/04/09 职场文书
股权转让协议书
2014/04/12 职场文书
2014年人事专员工作总结
2014/11/19 职场文书
人间正道是沧桑观后感
2015/06/15 职场文书
服装店员工管理制度
2015/08/07 职场文书
Django实现drf搜索过滤和排序过滤
2021/06/21 Python