Is it possible to separate the value from the JSON item?

Question

Let’s say I have such an object:

{
  "parametros": {
    "carteira": "RG", 
    "taxaboleto": "0.00", 
    "multa": "0.00", 
    "juros": "0.00"
  }
}

Is it possible that I can extract the name of the object item? For example, the "wallet" item: "RG", if I print on the screen as {{parametros.carteira}} (in Vue) I can print the value, but what if I need the name 'carteira' to be printed? How do I extract?

Take into account that I do not know which object is coming, it may be that the dynamic items that will appear...

Answer 1

One can use the Object.keys(), where it will return the object keys instead of the values. I made a very simple example below:

Helloworld.Ve

<template>
  <div class="stackoverflow">
    <div v-for="(parametro, key) in parametrosKeys" :key="key">{{ parametro }}</div>
  </div>
</template>

<script>
import { parametros } from './parametros'

export default {
  name: 'Stackoverflow',
  data: () => ({
    parametros
  }),
  computed: {
    parametrosKeys () {
      return Object.keys(this.parametros)
    }
  }
}
</script>

json parameters.

{
  "parametros": {
    "carteira": "RG",
    "taxaboleto": "0.00",
    "multa": "0.00",
    "juros": "0.00"
  }
}

Note that in the example I make a computed that only returns the keys using the Object.keys, but this could be performed directly. The above example would return all keys like this: