laravel掛載vue-compoent範例

 2,572 total views,  4 views today

laravel 5.8開始要測試vue 設定他的範例檔時,看了官方文件與很多部落格文章,幾乎都是抄來抄去的內容,但是一致性的都跑失敗。最後,終於在國外網站找到解法。

首先編輯 /resources/app.js

一般看到的程式碼都是這樣,如果這樣抄,都是掛載不起來的。

Vue.component('example', require('./components/Example.vue'));

正確的寫法

import ExampleComponent from './components/ExampleComponent.vue';
Vue.component('ExampleComponent', ExampleComponent);

接下來建立一個blade來顯示範例畫面,/resources/view/example.blade.php

<div id="app">
	<example-component></example-component>
</div>
<script>
new Vue({
		el: "#app"
	});
</script>

這樣就能成功顯示在網頁上了。

發表迴響

%d 位部落客按了讚: