前端处理后端返回的字典值

javascript 复制代码
<template>
  <div>

  </div>
</template>

<script>
export default {
  data () {
    return {
      data: {
        10: '北京',
        110: '山东'
      },
      optionsData: []
    }
  },
  methods: {
    tranFn() {
      console.log('data>>>', this.data)
      const arr = []
      for (let i = 0; i < Object.keys(this.data).length; i++) {
        arr.push({ value: Object.keys(this.data)[i], label: this.data[Object.keys(this.data)[i]] })
      }
      console.log('arr>>>', arr)
      this.optionsData = arr
    }
  },
  created () {
    this.tranFn()
  }
}
</script>

<style>

</style>
相关推荐
特立独行的猫a17 分钟前
用仓颉写一个 Tauri:IPC 的每次往返实现原理(web层到仓颉层的触发过程)
前端·ui·harmonyos·tauri·鸿蒙·仓颉
Dovis(誓平步青云)17 分钟前
多个链接不等于多份证据,新闻核验看板怎样合并来源
java·服务器·前端·javascript·人工智能·pdf·电脑
骑着蜗牛撵大象32732 分钟前
Qt 事件机制详解:从 QEvent 派生类到事件过滤器的全景指南
前端·python
qq_2518364571 小时前
理发管理系统 —— 会员模块
开发语言·前端·python·flask
Frag0ut1 小时前
2027 年浏览器展望:Chrome 与 Edge 的 AI 智能体进化方向
前端·人工智能·chrome·edge·浏览器·新功能
计算机魔术师2 小时前
从AI绘图鼻祖到音乐版权破局者,Stability AI如何被三大唱片巨头「收编」
前端
奕鼎竜瑆2 小时前
Chrome 插件开发实战指南:从入门到发布
前端·chrome
广州华水科技2 小时前
水库北斗GNSS变形监测系统及单北斗形变监测一体机应用解析
前端
anew___4 小时前
《从零手写操作系统 (20):ELF加载器——让OS读懂现代编译器》
java·服务器·前端
ss2734 小时前
AI全栈实战 | 2.3-01 组件库实战:Element Plus 怎么搭出专业界面,过度封装为什么成维护负担
前端·javascript·elementui·vue