How to send menu and other config options to Inertia? #462
-
|
Our team plans to create a large CRM on Inertia. The menu and other settings should be formed on the backend. How do I send the menu to Inertia for the first rendering? |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment
-
|
Hi, Currently, Inertia does not support this, as often menu items etc. depend on permissions, and since permissions can change, re-fetching information and having it updated really isn't that much of a big deal However, of course each use-case differs, so if you have a ton of menu items and/or settings that won't change (often), and really think only setting it on the initial render is the way to go, my recommendation would be to just use the If you do this in the <head>
<script>window.menuAndSettings = '{{ json_encode($menuAndSettings) }}';</script>
<script src="/js/app.js" defer></script>
<!-- ... -->
</head>With the above set, from within your Vue/Inertia app, you can then access the variable globally (on the window object) and use it to render your menu etc., which I would recommend doing in a persistent layout. One way to do so easily without all kinds of real hackery, is to 'wrap' the global object into a computed property, so Vue/Inertia becomes "aware" of it and you can interact with it as you normally would within Vue: <template>
<inertia-link v-for="item in menuItems" :src="item.href" :key=item.id>{{ item.label }}"</inertia-link>
</template>
<script>
export default {
// ...
computed: {
menuItems() {
return window.menuAndSettings.menu;
},
}
}
</script>While this approach might seem somewhat hacky (it is), it functions reliably and is easy to remove/refactor (which is super important with workarounds like this) if we end up deciding to support an 'initial render only' feature at some point. Until then, I believe this would be the best approach to take. Hope this helps! |
Beta Was this translation helpful? Give feedback.
Hi,
Currently, Inertia does not support this, as often menu items etc. depend on permissions, and since permissions can change, re-fetching information and having it updated really isn't that much of a big deal
However, of course each use-case differs, so if you have a ton of menu items and/or settings that won't change (often), and really think only setting it on the initial render is the way to go, my recommendation would be to just use the
app.blade.phpfile to assign the menu into a (global) javascript variable.If you do this in the
headof your page before the line where Inertia/Vue is loaded, you can immediately rely on it being set and use it without the need to do any further js-…