No More Posting New Topics!

If you have a question or an issue, please start a thread in our Github Discussions Forum.
This forum is closed for new threads/ topics.

Navigation

    Quasar Framework

    • Login
    • Search
    • Categories
    • Recent
    • Tags
    • Popular
    • Users
    • Groups
    • Search

    Listing different depths object using the same element

    Help
    2
    3
    109
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • A
      aseelmqannasa last edited by aseelmqannasa

      Hello,
      I am trying to list objects with different depths using q-tree element, to clarify:
      I am working on a dashboard, and I want to display lookups list of objects, but I do not have a specific depth for every lookup, like the following:
      I may have the following object in the list:

      { "country": { "SA": { "city": { "Ruh": { "locale": { "ar": "Riyadh", "en": "Riyadh" } } }, "locale": { "ar": "Saudi Arabia", "en": "Saudi Arabia" } } } }
      

      and may also have the following one:

      {"currency": {"JOR": {"locale": {"ar": "Dinar", "en": "JOD"}}}}
      

      and I want to list both of them using the same element, I am sorry if that isn’t clear enough, please ask me anything to clarify more.

      1 Reply Last reply Reply Quote 0
      • D
        dmoylan last edited by

        If I understand your problem, I believe you want to use a recursive function here. Iterate over an object, and for each property, if it’s a string, return it, otherwise call the function again.

        Here’s a function using lodash to generate a node list:

        const convert = function(object){
         return _.transform(object, function(result, value, key){
            if(_.isObject(value)){
            	result.push({
              	label: key,
                children: convert(value)
              })
            }else{
            	result.push({
              	label: key
              })
            }
           return result
          }, [])
        }
        

        Here’s a JSFiddle example with a working q-tree.

        A 1 Reply Last reply Reply Quote 0
        • A
          aseelmqannasa @dmoylan last edited by

          @dmoylan yes that’s it thank you!!

          1 Reply Last reply Reply Quote 0
          • First post
            Last post