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

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>
相关推荐
心连欣3 分钟前
跨越时代的对话:Vue 2 与 Vue 3 的终极对决与环境搭建指南
前端·javascript·vue.js
Csvn19 分钟前
Vue Router 实战
前端·vue.js
IT_陈寒43 分钟前
JavaScript实战技巧总结
前端·人工智能·后端
玲小珑1 小时前
AI Coding 与 Harness 实践精髓:让AI高效干活、持续交付
前端·人工智能·openai
skilllite作者1 小时前
Agent-Skills 核心能力与实战效能深度评测
大数据·开发语言·前端·数据库·人工智能·python
恋猫de小郭1 小时前
实用性 Max ,新 Flutter & Dart Agent Skills 深度解读
android·前端·flutter
一诺加油鸭1 小时前
若依(RuoYi)框架中普通用户角色登录后访问接口报 403 “当前操作没有权限”错误的完整解决方案
前端
宁雨桥1 小时前
AI前端开发面试题分享
前端·人工智能·ai
亿元程序员1 小时前
求求你别卷了,主管又转发你的文章到工作群了...我看了之后五味杂陈,决定卷个毛线!
前端
kyriewen111 小时前
你的前端滤镜慢得像PPT?用Rust+WebAssembly,一秒处理4K图
开发语言·前端·javascript·设计模式·rust·ecmascript·powerpoint