..Vue文件:将结构从“template：”迁移到<template></template>
..Vue文件:将结构从“template：”迁移到<template></template>
提问于 2019-10-02 13:07:16
我试图从工作版本中更改.vue文件的结构(与laravel一起使用)，如下所示：
旧foo-component.vue:
<script>
Vue.component("foo-component", {
data() {
},
props: {
},
methods: {
},
template: `
<div> Some Content Here </div>
`
});
</script>将此转换为.vue文件的其他结构：
NEW: foo-component.vue:
<template>
<div> Some Content Here </div>
</template>
<script>
export default {
name: 'foo-component',
data() {
},
props: {
},
methods: {
},
}
</script>老：main app.js:
Vue.component('foo-component', require('./components/foo-component.vue').default);
const app = new Vue({
el: '#app',
components: {
OtherComponents
},
data:{
},
methods: {
}
});NEW: main app.js:
Vue.component('foo-component', require('./components/foo-component.vue').default);
const app = new Vue({
el: '#app',
components: {
OtherComponents
},
data:{
},
methods: {
}
}); 但是我在浏览器中看到一个错误，上面写着：
[Vue warn]: Unknown custom element: <foo-component> - did you register the component correctly? For recursive components, make sure to provide the "name" option.然后，我在组件中添加了“foo-component”：{OtherComponents，OtherComponents}，但是事情变得很混乱，浏览器说：
Error: Module build failed: SyntaxError: X:/laragon/www/project/resources/assets/js/app.js: Unexpected token, expected , (38:35)我做错了什么？
下面是我在Laravel刀片home.blade.php中调用foo组件的HTML/View：
<html>
<head>
<link type="text/css" rel="stylesheet" href="{{ mix('css/app.css') }}">
</head>
<body>
<div id="app">
<foo-component></foo-component>
</div>
<script src="{{ mix('/js/app.js') }}"></script>
</body>
回答 2
Stack Overflow用户
回答已采纳
发布于 2019-10-02 14:42:22
我使它工作的方式是对app.js的更新：
Vue.component('foo-component', require('./components/foo-component.vue').default);
import FooComponent from './components/foo-component.vue';
const app = new Vue({
el: '#app',
components: {
OtherComponents,
'foo-component': FooComponent
},
data:{
},
methods: {
}
}); Stack Overflow用户
发布于 2019-10-02 13:37:22
您必须在app.js中注册您的组件
Vue.component('example-component', require('./components/ExampleComponent.vue').default);页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/58202181
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号