[Vuejs]-Vue 3 not rendering components (in Laravel 8)

by

0👍

✅

You need to reference app.js in your blade file and add id app to html tag:

<section id="app">
    <h1>Carousel</h1>
    <carousel :slides="@json($data->slides)"></carousel>
<section>
<script src="{{ mix('css/app.js') }}"></script>
👤Wilson

1👍

  • First, in your app.js, it’s how Vue2 init but not Vue3
// vue2 way
new Vue({`
    el: '#app',`
});

// vue3 way
Vue.createApp(...).mount('#app')

See how Vue3 init via the hello-word of Vue3.

  • Second, there is no fragment in Vue3 built-in-components.

Read the document for more details about built-in-components.

In Vue3, you can write a multiple roots component without <fragment> directly

<template>
    <h1>My component</h1>
    {{ slides }}
</template>
👤DengSihan

Leave a comment