Vue.js / Laravel - Handle logout correctly
That's a bit old, however, I've just started with Laravel/Vue and managed to do this quite simple. Using the integrated auth from Laravel, you could just simulate the logout from app.blade.php like so:
<b-dropdown-item href="#" onclick="event.preventDefault(); document.getElementById('logout-form').submit();">Sign Out</b-dropdown-item> //that's instead of a regular <a> tag
<b-form id="logout-form" action="logout" method="POST" style="display: none;">
<input type="hidden" name="_token" :value="csrf">
</b-form>
You'll need to have the csrf token passed through data in your script in order for it to work like so:
export default {
data() {
return {
csrf: document.querySelector('meta[name="csrf-token"]').getAttribute('content')
}
},
methods: {
submit : function(){
this.$refs.form.submit();
}
}
}
As well as adding a meta csrf in your head (blade.php file) like so:
<meta name="csrf-token" content="{{ csrf_token()}}">
I'm assuming you'll be using the logout in your navbar .vue file