How to get value if key?

I have a json object like this:

"data" : 
{ "measure": 
        [{ "type": "Temp", "data": 300, },
        { "type": "Volume","data": 200}]
}

How can I access the data key’s value based on the the type key’s value?

For ex. I have a box in vue and I want to put 300 in Temperature(I can’t access by measure[0].data because I need it to be dynamic):

<div class="box e" >
  Temperature: {{}}
</div>

Thanks so much!

Hello!

Something like this?

const o = {
  data: {
    measure: [{
        type: "Temp",
        data: 300,
      },
      {
        type: "Volume",
        data: 200
      }
    ]
  }
}

const filtered = o.data.measure.filter(i => i.type === 'Temp')
console.log(filtered)
// Output: [{type:"Temp", data:300}]
2 Likes

Thanks so much, this is great! Is there a way for me to do it without adding const o or can I do that in vuex where I have data saved?

Also is there a way for me to assign a data point to a div? Like for ex if I have many boxes of different measurements, when the data comes in I want it to assign the data point to the box in vue:

<template>
<div class="box a" >
  Temperature: {{}} //will display 300 here
</div>
<div class="box b" >
  Volume {{}} // will display 200 here
</div>
</template>

Basically like a way for the template to know to assign the correct data points to the correct box.

Yes, of course :slight_smile:. It was just an example to show you how can be achieved. Vuex is just an object, so if you have access to any particular object inside the state managed by it, you can do the same.

I would say, 99% of the time everything is possible. In rare cases, you have to
restructure your project/code to implement what’s needed.

Vue, as well as Angular and React, has something called Conditional Rendering, so use that to do what you asked :slight_smile:.

1 Like

Thanks so much! Really appreciate your help!

1 Like