laravel-8 - Vuejs3 道具从 laravel 刀片到 vue 组件未定义
问题描述
这是刀片文件
@extends('layouts.master')
@section('content')
<div id="app">
<demo test="fsdf"></demo>
</div>
<script src="{{asset('js/app.js')}}"></script>
@endsection
这是 app.js 文件
import {createApp} from 'vue';
import Demo from './components/Demo.vue';
const vue3App = createApp(Demo);
vue3App.mount('#app');
这是 Demo.vue 文件
<template>
<h1>Demo</h1>
</template>
<script>
export default {
props: ['test'],
setup(props) {
console.log(props);
}
}
</script>
演示组件中的道具总是显示未定义!不知道我错过了什么。我也在使用 6.0.34 的 laravel-mix。
解决方案
它是未定义的,因为您必须先注册组件
import {createApp} from 'vue';
import Demo from './components/Demo.vue';
const app = createApp({
mounted() {
console.log('The app is working')
}
});
app.component('demo', Demo); //global registration
app.mount('#app');
推荐阅读
- java - 需要帮助让我的按键听众脱离主线
- ruby-on-rails - Rails XHR 导致错误:SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data
- excel - 查找行并存储在数组中的 VBA 宏运行缓慢
- powerbi - Power BI - 在多个 True/False 标志列上创建切片器
- windows - 如何在 c++ 项目中包含 windows WexTestClass.h
- vba - 在 vba 环境之外编译问题
- python - 为什么这种寻找素数的筛法比蛮力慢
- php - 阿帕奇。如何将 wp-config.php 和 wp-content 从 wordpress 核心移出?
- javascript - 如何将资产中的图像附加到rails 5中的红宝石对象
- javascript - How to filter a Google Visualization Chart by row headers (categories) instead of first column