I'm trying to make a link to a Laravel view called faq.blade.php from my Vue component, I tried to use axios and even when it returns the console.log I left after the response it isn't loading the view. How could I solve it?
FaqController.php
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class FAQController extends Controller
{
public function index(){
return view('main.faq');
}
}
I try to call it from this component: Main.vue (which is in the '/' route)
<b-list-group-item align="left" @click="faq"><strong>></strong> FAQ</b-list-group-item>
<b-list-group-item align="left" @click="services"><strong>></strong> Services</b-list-group-item>
<script>
export default {
methods: {
faq() {
axios.get('/faq')
.then(res => {
console.log("faq");
})
},
services(){
axios.get('/services')
.then(res => {
console.log("services");
})
}
}
}
</script>
Routes: web.php
Route::get('/', function () {
return view('main.landing');
});
Auth::routes();
Route::get('/home', 'HomeController@index')->name('home');
Route::get('/faq', 'FAQController@index')->name('faq');
Route::get('/services', 'ServicesController@index')->name('services');
The Axios call will get the block of HTML as a string in the response, you don't want to do that, if you want to load that view into the browser, simply redirect to that route
export default {
methods: {
faq() {
window.location = "/faq";
},
services() {
window.location = "/services";
}
}
};
But if you want the page not to reload/refresh (which is why I think you're using axios) then you can either use TurboLinks or setup an SPA with VueRouter and load a view as a component
Hope this helps
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.