[solved] q-tree handler not working?

[rconstantine]

Hey guys,

I have a tree of nested objects. I see on https://quasar.dev/vue-components/tree that there should be a ‘handler’ function that I can set. But it doesn’t seem to get called. In my tree, I have this:

        <q-tree
          ref="bottomTree"
          :nodes="booksMenuBottom"
          node-key="nid"
          accordion
          color="icon-button"
          text-color="white"
          class="q-ml-sm q-mt-sm tree-height"
          :selected.sync="selectedBottom"
          :no-nodes-label="noNodesLabel"
          :style="bottomVisibility"
          :handler="bottomMenuClicked"
        />

In “bottomMenuClicked”, I’m just outputting node to the console thusly:

    bottomMenuClicked (node) {
      console.log('the NODE!!!', node)
      // this.$refs.bottomTree.setExpanded(this.selected, true)
    }

This doesn’t get called. I noticed that the handler isn’t actually listed on the API widget, but is in the table below it. So I’m not sure if it actually exists, or if I’m doing something wrong. Any help is appreciated. I’m running 1.0.5.

[rconstantine]

Oh, I think I see my problem. The handler is on the node, not the tree. Hmm. I’ll see what I can do with that.

[rconstantine]

OK. I sort of get it, but still have a problem. I’m using Vuex, and in an action.js file, I have a function that massages data I get from a JSON API. Among other things, it adds a reference ID to the tree node’s parent. While I’m doing that, I also am now adding a handler function reference. It is working inasmuch as it is logging to the console.

However, both of the above functions are defined such that I don’t seem to have access to this.$refs. Can someone remind me what I need to include to get access to the app’s main object inside my action.js file?

[metalsadman]

@rconstantine you can pass this (ie someAction({ payload, vm: this })) as parameter to your action, though that seem bad practice to manipulate your view inside your action. better to return a value from your action and handle it in your view imo.

[rconstantine]

Hmm. I agree I’d rather not manipulate the view from an action. I think I’ll try to pass in a reference to the function, which I’ll define in the same vue file as is making the call to the action. In that case, I suppose it could be part of the payload. Thoughts?

[rconstantine]

I figured out my issue: https://forum.quasar-framework.org/topic/4269/solved-given-a-leaf-in-a-q-tree-how-can-i-programmatically-select-a-leaf-and-open-all-parents

I hope it’s OK I started another thread. I was coming at it from a different point of view than I was here.