The problem
I am trying to make a dynamic app sidebar to react and refresh when a new content category is created. However emitTo('docs.sidebar', 'refresh') to 'docs.sidebar' component is not working.
I have found out that when i start typing into input field - component 'docs.sidebar' disappears from loaded components in debugbar. Which obviously means that something refreshed in whole layout and the only component remains is the 'docs.create-category'.
Component 'docs.sidebar' has $listener for refresh included and is included in main layout using livewire directive.
#livewire('docs.sidebar')
And the component 'docs.create-category' is a full page component using the main layout where 'docs.sidebar' is included.
What have i tried?
I have tried to add wire:ignore and wire:ignore.self in both correlating components various places, however that did no help.
Attaching screen recording to see problem visually.
https://youtu.be/kkOrgQXVyGo
Views:
Layout: https://paste.laravel.io/7dfe2b11-e7c9-4905-a644-133c783e8ba6
Create category component: https://paste.laravel.io/92ea800a-96bc-4286-aedc-f16a65aa4e3f
Related
So I have this Laravel 9 project. In this view below you can see the navigation bar:
The menu above for the active link (Overview) styling (Tailwind) is active via the check below in the view for the component looking at the request information:
#if(request()->is('dashboard/*/overview'))
This works great as the url currently is
localhost/dashboard/{ID}/overview
When clicking the bottom nav link for the Dividends this fires a livewire event for this account as they don't have permissions to access the page. No navigation away from the page Overview is performed. This event is used to setup a popup when the user doesn't have access to a feature. (I have these in a few places)
The issue is that when one of these fires it sets the 'is' check value in the request to
/livewire/message/{COMPONENT_NAME}
This seems to be the expected behaviour of the livewire events. I attempted a similar check using the code below but the same result occurred as the data is still tied to the request.
#if(request()->pathInfo == "dashboard/7/overview")
If anyone knows of another way or a better way I could have the intended functionality so that the button keeps it's 'active' properties after a livewire event has ran, I'd appreciate it :)
I have page that has v-tabs using the nuxt attribute, each tab directs to a dynamic route
cars/_brand_name/index.vue (making the _brand_name a mandatory parameter)
When I load the page /cars/bmw: mounted get's called successfully but after switching to other tabs the URL updates correctly but the page no longer re-renders, mounted no longer getting called.
Am I missing some part of the lifecycle? Should I be watching the route param and force the page to reload? I don't remember needing to do this with Vue alone.
This is often caused when the route component is the same as previous route. The best way to force Vue to re-render the page is to set a :key attribute on the router with a unique value, it is common to use $route.fullPath.
Update your router view like so.
<router-view :key="$route.fullPath"></router-view>
I have two pages when user open application first page get data ,
I created another page and when click add in first one it navigate to the second page , I want when adding the required data in the second page and click submit first page is removed and created again with the newest data
first page is CustomerAddressesPage and second one is AddNewAddressPage
this is my code
await _navigationService.NavigateAsync("/CustomerAddressesPage/AddNewAddressPage/CustomerAddressesPage");
It got me error
Removing views using the relative '../' syntax while navigating is only supported within a NavigationPage
The error tells you exactly how you can fix the issue.
_navigationService.NavigateAsync("/NavigationPage/CustomerAddressesPage/AddNewAddressPage/CustomerAddressesPage");
This of course assumes that you have registered the base NavigationPage from Xamarin.Forms for Navigation or have a custom NavigationPage that was registered with that key.
I have angular2-nativescript application with several pages. structure is similar to gloceries example
All pages has very similar action bar content so I don't want to add all action bar event handlers for each page or add custom component to each page template
Is there any way to have single ActionBar component for all application pages? Also it is important to have an ability to access this component from all pages and call its methods from page class (so I can tell this component that it should hide/show some content). I want to use some action bar animation in future so my ActionBar shouldn't be recreated each time page changes
Ok so lemme explain first for those who are not familiar
Rule number for using Telerik's Kendo UI is to reference the following in this order Jquery.min.js>Angular.min.js>Kendo.all.min.js
Here is the pseudo-code of my web application
in my parent.html:
-reference for jquery
-reference for angular
-reference for kendo
-ui-view container
this is my ui-view(child.html)
-initialize kendo grid
What happened is that the kendo widget was not rendered
Then I looked at the console of the browser and there was something like
"Jquery should be initialized first before angular when using Kendo-UI widgets"
I tried removing the ui-view and and just yolo-pasted the contents of the child.html and the grid widget successfully rendered
But when I use angular-ui-routing, the error appears again saying I should reference jquery first before referencing angular when using kendo widgets
You can only load jQuery once. I had a similar problem where I was calling it once from a shared view and once inside the main view. You have child views? My solution was to push the loading of the Javascript from the shared view to the main view, and also called them inside of the kendo tabStrips, because apparently those were sandboxed enough not to affect the main view. The second loading of jQuery is what's crushing the kendo rendering; figuring out the workaround depends on the relationships between the views.