How to manipulate JSON / Array for QTable

  • if the below array is used as data for Qtable

    user = { fname: "mike", lname : "duke", age : 35, hobby :"swimming"}

    we will get,

    fname lname age hobby
    mike duke 35 swimming

    Q1. how can I manipulate the user array and/or Qtable property to makes it into

    keys values
    fname mike
    lname duke
    age 35
    hobby swimming

    The user array would be dynamically loaded from API and content varies,

    Q2. is there any other quasar components for viewing/listing this as shown above?

  • @ebena

    Use q-table with :data=“userData” and define userData as a computed property:

    computed: {
        userData: function () {
          return Object.entries(this.user).map(([k,v]) => { return {key: k, value: v} })

  • @rab it work,
    thank you.

  • With above solution by @rab, master details using QTable is easily achievable.

Log in to reply