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

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>
相关推荐
梨子同志几秒前
JavaScript Proxy 和 Reflect
前端·javascript
汤圆炒橘子4 分钟前
状态策略模式的优势分析
前端
90后的晨仔20 分钟前
解析鸿蒙 ArkTS 中的 Union 类型与 TypeAliases类型
前端·harmonyos
IT_陈寒37 分钟前
Element Plus 2.10.0 重磅发布!新增Splitter组件
前端·人工智能·后端
挑战者66688837 分钟前
vue入门环境搭建及demo运行
前端·javascript·vue.js
贩卖纯净水.38 分钟前
Webpack的基本使用 - babel
前端·webpack·node.js
用户882093216671 小时前
Vue组件通信全攻略:从父子传参到全局状态管理,一篇搞定!
前端
Canmick1 小时前
JavaScript 异步函数健身操
前端·javascript
一曝十寒1 小时前
那些常见的 HTTP 状态码
前端·http
WildBlue1 小时前
🚀 React初体验:从“秃头程序员”到“数据魔法师”的奇幻漂流
前端·react.js