CODEWITHSUNDEEP
vue.js
Dmitry Bubnenkov
Dmitry Bubnenkov

Reputation: 9869

How to get access to two-level nested variable?

There is pretty clear how to get access to variable in data. But how to do it, if it have 2-level nesting:

new Vue({
  el: '#app',
  data: {
    users :
        {
        foo : {
        name : "aa"
      }
    }
  }
})

How to display: name ?

https://jsfiddle.net/n1ewmfs5/

Upvotes: 0

Views: 59

Answers (2)

Himanshu sharma
Himanshu sharma

Reputation: 7929

What is the issue with that . It is just a json.

Json can be access by . symbol .

if you have {a:{b:{c:'name'}}}

you can access a.b.c or a['b']['c']

check the jsfiddle.

https://jsfiddle.net/himmsharma99/ctj4sm7f/

`<div id="app">
  <p>{{users['foo']['name'] }}</p>

  <div >
  <p>{{users.foo.name }}</p>
</div>`

Upvotes: 0

ValDaHus
ValDaHus

Reputation: 376

Not sure If I really understand the question but here you have two examples (taken form your jsfiddle) that access "name" from the users object you have provided.

<p>{{users['foo']['name']}}</p>

or you can

<p>{{users.foo.name}}</p>

But you maybe want to have an array of users?

Upvotes: 1

Related Questions