数据处理 array json 格式 转换成 数组形式
处理这种数据应该使用的方式是
this.cities= res.data.data.cities.sort((a,b)=>{ //排序 进行字母排序
return a.pinyin[0].charCodeAt()-b.pinyin[0].charCodeAt()
}).map((item)=>{ //映射 返回一个对象放入数组
return {
"id":item.id,
"zm":item.pinyin[0],
"name":item.name
}
}) //处理结束后
接下来如果 只想显示 每个开头的来的字母(zm) 比如 像下面这种的
那么
<h3 :id="item.zm" v-if="index===0 || index!=0 && item.zm!=cities[index-1].zm">{{item.zm}}</h3> //判断 index===0 显示 该项
//当index 不是0的时候 让你所想要显示的内容 去与它的 前一项比较 如何不相等就显示。
//index-1 不能为写成index 因为没有-1项。
数据处理 array json 格式 转换成 数组形式的更多相关文章
- (转)json格式转换成javaBean对象的方法
把json格式转换成javaBean才可以.于是查了一下资料,网上最多的资料就是下面的这种方式: Java code? 1 2 3 4 5 6 7 8 9 String str = "[{\ ...
- json格式转换成Map的应用
jsp 1.引用json.js(将json格式转换成字符串) 2. var name = document.getElementById("name").value; var re ...
- php 字符串内容是数组格式 转换成数组
一个简单的应用.. 例, $str = "array( 'USD'=>'1', 'GBP'=>'0.6494', 'EUR'=>'0.7668' ,'JPY'= ...
- 解决只有单引号的Json格式转换成bean问题
objectMapper.configure(Feature.ALLOW_UNQUOTED_FIELD_NAMES, true);单引号类似Json格式:{id:124463277,code:null ...
- JSON格式转换成XML格式
第一种方法: 需要使用命名空间System.Runtime.Serialization.Json 下面有JsonReaderWriterFactory XmlDictionaryReader read ...
- 使用jackson来进行数组格式的json字符串转换成List。
有一个字符串如下.如下,也是通过jackson把list转换成的json字符串,我想把它转过来,看网上的内容都不尽人如意,都是片断的内容.估计只有写的知道怎么使用,所以就直接看了jackson的官网, ...
- xml转换成数组array
直接上代码,成功转换 if($data){ //返回来的是xml格式需要转换成数组再提取值,用来做更新 $startnum = strpos($data,"<xml>" ...
- js 判断是否为数组的方式 及 类数组转换成数组格式
1. 判断是否为数组的通用方式 Object.prototype.toString.call(o)=='[object Array]' 其他方式: typeof , instanceof, ary ...
- Json格式转换
验证Json格式可以进入 http://json.cn/ json简单说就是javascript中的对象和数组,所以这两种结构就是对象和数组两种结构,通过这两种结构可以表示各种复杂的结构1.对象:对象 ...
随机推荐
- @ResponseBody注解和@RequestBody注解
@ResponseBody:表示该方法的返回结果直接写入HTTP response body中一般在异步获取数据时使用, 在使用@RequestMapping后,返回值通常解析为跳转路径,加上@Res ...
- human pose estimation
2D Pose estimation主要面临的困难:遮挡.复杂背景.光照.真实世界的复杂姿态.人的尺度不一.拍摄角度不固定等. 单人姿态估计 传统方法:基于Pictorial Structures, ...
- Angular中$watch实现控件改变后实时发送HTTP请求
实现代码如下 <!DOCTYPE html> <html ng-app="myServiceApp"> <head> <meta char ...
- win21api、win32gui、win32con三个模块操作系统窗口时一些小技巧
下面这段脚本是操作一个浏览器上弹窗,打开文件窗口,由于脚本 执行速度快,当时未添加第2行的延时时,脚本顺利的执行成功,但弹的窗却没有进行操作,建议后续如果脚本执行到打开弹窗时,延时个几秒再去操作所弹窗 ...
- 学习Ant Design Pro的一点心得
1.控制反转(Inversion of Control)是一种「思想」,依赖注入(Dependency Injection)则是这一思想的一种具体「实现方式」 2.react 要注意全局 id相同 3 ...
- 寒假训练——搜索——C - Robot
The Robot Moving Institute is using a robot in their local store to transport different items. Of co ...
- python脚本后台启动
nohup python -u test.py > out.log 2>&1 & nohup python -u 文件路径 > 打印日志 2>&1 &a ...
- cocos2d-x 绘制图形
转载请注明出处:http://blog.csdn.net/oyangyufu/article/details/25841727 绘制图形例如以下: 程序代码: 须要又一次定义父类虚函数draw() ...
- 正则表达式工具RegexBuddy
1 下载 RegexBuddy 并安装 安装后的界面如下: 2 切换布局 点击右上角的彩色格子图标,选择 Side by Side Layout: 这种布局的好处是,Create 面板 ...
- UVA120-Stacks of Flapjacks(思维)
Problem UVA120-Stacks of Flapjacks Accept: 9232 Submit: 38455Time Limit: 10000 mSec Problem Descrip ...