http://blog.asial.co.jp/1496
↑こちらのサイトを参考にしながらlaravel + vue.jsを学んでいるのですが、最後のhelloコンポーネントの部分が上手く行きません。
resources/assets/js/components/Hello.vue
php
1<template> 2 <h2>Hello <span class="name">{{name}}</h2>!</div> 3</template> 4<script> 5 export default { 6 props: ['name'] 7 } 8</script> 9<style scoped> 10 .name { 11 font-weight: bold; 12 } 13</style>
resources/assets/js/app.js
php
1/** 2 * First we will load all of this project's JavaScript dependencies which 3 * includes Vue and other libraries. It is a great starting point when 4 * building robust, powerful web applications using Vue and Laravel. 5 */ 6 7require('./bootstrap'); 8 9/** 10 * Next, we will create a fresh Vue application instance and attach it to 11 * the page. Then, you may begin adding components to this application 12 * or customize the JavaScript scaffolding to fit your unique needs. 13 */ 14 15Vue.component('example', require('./components/Example.vue')); 16Vue.component('hello', require('./components/Hello.vue')); 17 18const app = new Vue({ 19 el: '#app' 20});
welcome.blade.php
html
1<div id="app"> 2 <hello></hello> 3 <hello name="Laravel"></hello> 4 <hello name="Vue.js"></hello> 5</div>
本来ならwelcome.blade.php(トップページ)にて
Hello!Laravel
Hello!Vue.js
と表示されるはずなのですが
[Vue warn]: Unknown custom element: <hello> - did you register the component correctly? For recursive components, make sure to provide the "name" option. (found in <Root>)
というエラーが出て先に進めません。
Exampleコンポーネントは上手く作動しているので、helloと見比べてみましたがあまり違いがわかりません。
解決方法を教えて頂けたらと思います。宜しくお願い致します。
回答3件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/04/10 14:20
2018/04/12 08:13