What's new in Laravel-Livewire V2.6 ? | Part 1

alright friends welcome back to another video on laravel and livewear recently livewire version 2.6 got released with lots of different cool features and in this video we'll be discussing three of them i have created the copy of same project and one project is running on port 8000 and another project is running on port 8001 so we'll be updating our live web version on this project so let's get started okay so first of all let me go to composer.json file and over here we are using liveware version 2.3 so let me change this to 2.6 and let me open up the terminal and over here we can either do composer update it will update each and every dependencies and if you just want to update the single package then you can do composer update and then enable the package and it got updated so in this project we are using liveware version 2.6 and on another project we are using livewire version 2.3 so let me show you that as well 3.3 now let me start with the first one that liveware now can detect multiple root elements so let me show you what live work can do so let me go to update profile.blade.psp and over here and here we have the single root element and we are wrapping everything with a single foot element right so now if i remove this root element now we are having two different root elements right we are not wrapping them with a single root element so if i save this and let me go to this project where we have livewire version 2.3 let me go to profile and we have this let me remove this comment let me refresh the page and if i do save changes it is not working right so let me open up the console as well let me go to console and we don't see any warnings or error messages as well so this creates lots of confusions while using liveware first time so i have also gone through this issue so we don't know what is the issue and live work is not showing a warning or any issue and this space is not working right because while creating live wear component we need to wrap these things with a single root element right so let me do ctrl z now if we wrap everything with the single root element and then let me save this refresh the page and it will start working let's do the same for our updated present on this project so let me go to this copy one let me go to update profile.psp and let's do the same as well and let's remove this div from here and then here as well now we do not have single root element we have two different elements right let me save this open up the browser and refresh and let me go to profile and let me open up the console as well now if i click conception it will still not work because we need to wrap everything with a single root element but the added feature is on the console there we see the warning right and it is saying that multiple root element detected and this is not supported so likewise do not support the multiple root elements so we need to wrap this with a single root element right so this can be very useful to detect some errors and we know the exact thing that life do not support multiple root elements and such partnering helps us to fix our issues so this can be very useful let me undo the changes and refresh the page and everything is working now let's move to the next one and the next one is livewear now support more delay durations so let me go to a loading indicator.lay.php file and we have already integrated loading indicator on previous videos and over here we are using the delay modifier and it is saying that if we are getting the delay of more than 200 milliseconds then we will be displaying that loader right so let me show you by pretending that we are on slow network connection let me do fast 3g and if i click on this we see this loading spinner right by default it was 200 milliseconds but now we can modify this 200 milliseconds to different milliseconds like if i add another modifier called sawtest and it will be 50 milliseconds and if i refresh the page first of all let me do no throttling and then first 3g if i click on this and we see this loading spinner instantly right now there are different modifiers so for shortest it is 50 milliseconds and there is another one called sorter which is 100 milliseconds and another one is shot which is 150 milliseconds and by default it is 200 milliseconds and another one is long which is 300 milliseconds and another one is longer which is 500 millisecond and finally we have longest which is 1000 milliseconds right so if there is a delay of one second then we'll be showing that loading spinner so let's try this one as well no throttling refresh the page if i click on this we don't see that loading spinner but if i do slow 3g and let me go to all and we don't see that loading spinner for one second and after one second we see that loading spin right so this can be useful in some way so i just want to stick with the default one called 200 milliseconds so let me remove that and let me close this and refresh the page and everything is working now let me move to the third one and the final one which is now we can add the width method on our redirect helper let me go to create appointment form and on this redirect helper we can add another method called width and we can pass these success message and let's say appointment created successfully okay and let me go to list appointments.blade.php file and over here let me do if there is success message on our session then we'll display the message right also you can add some styling as well for now let me just display that message session success message let me refresh it let me go to add new appointments let me add a new appointment caller date time and then note let me save this and we see the success messages right also you can add some styling but if i do the same thing on our library version 2.3 on our old project let me go over here let me go to create appointment form and let's do with success message appointment created successfully let me go to list appointments.blade.php file and over here let me paste that same code now let me go to browser and instead of this project let me go to this one let me go to appointments a new appointment let me fill up this form time node click on save and we are getting the exception that width method does not exist but in livewire present 2.6 it is working so this much for this video i hope you learned something from this video so don't forget to like share and subscribe to this channel as i will be uploading the videos like this and till then have a great time and i will see you on the next one [Music]

Channel: Clovon

Views: 1,358

Keywords: coding, tutorial, laravel, laravel and livewire tutorial, laravel and livewire project, laravel admin panel, laravel adminlte, laravel admin, livewire tutorial, laravel application development, learn laravel 8, learn laravel framework, laravel crud, laravel crud tutorial, laravel how to, adminlte with php, livewire events, laravel livewire popup modal, laravel livewire tutorials, laravel livewire, what's new on livewire v 2.6, clovon

Id: nemtG5SGKvw

Length: 8min 37sec (517 seconds)

Published: Fri Sep 17 2021