：未知的自定义元素：<cc-text-area> - 您是否正确注册了组件？
P粉717595985
2023-08-30 23:38:03
<p>我正在制作一个组件InputText.vue，如下所示：</p>
<pre class="brush:php;toolbar:false;"><template>
<div class="row">
<div class="col-sm-12">
<div class="form-group">
<h4>Edit Text:</h4>
<textarea class="form-control" cols="50" rows="4" placeholder="Enter text here..." v-model="textBoxInput" @keyup="textChanged"></textarea>
</div>
</div>
</div>
</template>
<script>
export default{
data: function(){
return {
textBoxInput: ""
}
},
methods: {
textChanged: function(){
this.$emit('displayTextChanged', this.textBoxInput);
}
}
}
</script></pre>
<p>然后我在 CardFront.vue 组件中注册并使用它，如下所示：</p>
<pre class="brush:php;toolbar:false;"><style>
.edit-area {
padding: 20px;
height: 800px;
background-color: #d2f9f9;
}
.card-display {
padding: 20px;
height: 800px;
}
</style>
<template>
<div class="row">
<div class="card col-sm-6 edit-area">
<cc-text-area></cc-text-area>
</div>
<div class="card col-sm-6 card-display">
</div>
</div>
</template>
<script>
import TextInput from './TextInput.vue'
export default{
components: {
ccTextArea: TextInput
}
}
<script></pre>
<p>它给出了这个错误：
错误</p>
<p>请帮帮我。我正在使用 Vue 版本 2。每当我尝试刷新页面时，它都会给出如下错误： [Vue warn]: Unknown custom element: - 你是否正确注册了组件？对于递归组件，请确保提供“名称”选项。</p>
检查文件名和组件名称是否匹配。
如果您在使用组件中
从“./TextInput.vue”导入 TextInput，那么还要确保为您的组件命名，并且可以选择添加name属性按照评论中的建议。// TextInput.vue (not InputText.vue) export default { name: 'TextInput', ... }我解决了这个问题。非常感谢大家的帮助。问题在于 CardFront.vue 组件中的结束脚本标记。