时间戳

首页 > 解决方案 > Vue警告：未知的自定义元素：- 您是否正确注册了组件？

javascript - Vue警告：未知的自定义元素：- 您是否正确注册了组件？

问题描述

我正在尝试修复组件中的以下错误，但它仍然失败。错误如下：

[Vue 警告]：未知的自定义元素“education-item”：- 您是否正确注册了组件？对于递归组件，请确保提供“名称”选项。

在我的密码组件中，按照脚本，我有以下内容：

<template>
<b-list-group class="education-list">
        <b-list-group-item
          class="align-items-start"
          v-for="(education, i) in educations"
          is="education-item"
          :key="i"
          :institute="education.institute"
          :major="education.major"
          :from="education.from"
          :to="education.to"
          @click:edit="education.splice(_id, 1)"
        >
          <div class="row" id="edu-item">
            <div class="eduimg col-md-2 pl-2 pt-2">
              <span class="dot"></span>
              <img class="dot-line" src="../../assets/line.png" />
            </div>
            <div class="col-md-10 pl-0 pr-0">
              <div class="eduinfo" id="eduinfo">
                <h6 class="institute font-weight-bold mt-2 mb-0">{{ education.major }}</h6>
                <p class="mb-0">{{ education.institute }}</p>
                <p class="mb-3">{{ education.from + " - " + education.to }}</p>
              </div>
            </div>
          </div>
        </b-list-group-item>

</template>

<script>
import AddEducationForm from "@/components/form/AddEducationForm";
import MainButton from "@/components/common/ui/main-button";

export default {
  name: "my-education",
  components: {
    AddEducationForm,
    MainButton,
  },
  props: {
    education: Object

  },
  data() {
    return {
      modal: false,
      isLoading: false,
      isEditing: false
    };
  },
  methods: {},
  computed: {
    isOwnProfile() {
      return this.profile.user._id === this.$store.getters.loggedInUser._id;
    },

    educations() {
      return this.$store.getters.profile.education;
    }
  }
};
</script>

问题是页面打开时vue组件没有加载，刷新后错误消失。

有人可以帮我解决我的问题吗？如果有人可以指导我解决这个问题，我将不胜感激。

标签： javascriptmongodbvue.jsvue-component

解决方案

<script>在标签内添加一个 import 语句，如下所示：

import EducationItem from 'wherever/your/component/is';

然后将其添加到您的组件定义中，如下所示：

 components: {
    AddEducationForm,
    MainButton,
    EducationItem
  },

推荐阅读