boussadjra / vue3-router-tree Goto Github PK

Hello thanks for your great project, but im new to vuejs and i cant make it work on my project.

I have installed your project and import it, but it says not found
this what my code look like
<template><vue3-router-tree :items="routes"> </vue3-router-tree></template>
`<script>
import Vue3RouterTree from '.vue3-router-tree';
export default {
name: 'categoryProduct',
components: {
Vue3RouterTree
// Loading
},
data: function(){
return {
routes: [
{
path: '/',
name: 'Home',
hasIcon: true,
},
{
path: '/dashboard',
name: 'Dashboard',
hasIcon: true,
},
{
path: '/component',
name: 'Components',
hasIcon: true,
children: [
{
path: '/alerts',
name: 'Alerts',
},
{
path: '/avatars',
name: 'Avatars',
},
{
path: '/buttons',
name: 'Buttons',
},
{
path: '/forms',
name: 'Forms',
children: [
{
path: '/autocompletes',
name: 'Autocompletes',
},
{
path: '/checkboxes',
name: 'Checkboxes',
},
],
},
],
},
],
}
},
}

I have a warning in my console and not sure if it is the cause of there being no tree rendered:

[Vue warn]: inject() can only be used inside setup() or functional components.

The warning relates to line 54 in index.tsx?d1dd:54 which if I follow the link to the source is the following line in your package:

const router = useRouter()

As far as I can tell my routes object is as required and I see the items in the VueJs Dev tools when inspecting the component.

Any ideas?

Hi,

When I put "open-all", I can't manually collapse an item. Can you help me please?

Is there a way I can add an onclick function on the tree items?
I am looking to utilize this as a File tree for in browser editing, and I want to be able to select the file in the list, and have it run a function that will open the file in the text editor.

How would I define the function ran on selecting an item?