Laravel Blade pasing json to Vue Component

Posted 4 months ago by danyal14

I tried every possible way, may be I am missing something. when i pass json to vue component it breaks.

Route::get('/', function () {
   return view('web.index', [
       'active_link' => 'home',
       'data' => [
           ['id' => 1, 'image' => '/images/img1'],
           ['id' => 2, 'image' => '/images/img2'],
           ['id' => 3, 'image' => '/images/img3'],
        <home :active-menu-link="'{{ $active_link }}'" :data="{!! json_encode($data) !!}"></home>
        <home :active-menu-link="'{{ $active_link }}'" :data="'{!! json_encode($data) !!}'"></home>

This is being displayed on page.
":1,"image":"\="" images\="" img1"},{"id":2,"image":"\="" img2"},{"id":3,"image":"\="" img3"}]'"="">

        <home :active-menu-link="'{{ $active_link }}'" :data="{{ $data }}"></home>

htmlspecialchars() expects parameter 1 to be string, array given (View: /path/resources/views/web/index.blade.php)

Please sign in or create an account to participate in this conversation.

Reply to

Use Markdown with GitHub-flavored code blocks.