如何在Bootstrap Vue中呈现自定义组件？(Vue.js 2)

npm install vue bootstrap-vue bootstrap

<template>
  <div>
    <b-button @click="showModal">打开模态框</b-button>
    <b-modal v-model="showModalFlag" title="自定义组件示例">
      <custom-component></custom-component>
    </b-modal>
  </div>
</template>

<script>
import CustomComponent from './CustomComponent.vue';

export default {
  components: {
    CustomComponent
  },
  data() {
    return {
      showModalFlag: false
    };
  },
  methods: {
    showModal() {
      this.showModalFlag = true;
    }
  }
};
</script>

<template>
  <div>
    <h2>这是自定义组件</h2>
    <p>这是自定义组件的内容。</p>
  </div>
</template>

<script>
export default {
  // 自定义组件的逻辑代码
};
</script>

<template>
  <div>
    <custom-component></custom-component>
  </div>
</template>

<script>
import CustomComponent from './CustomComponent.vue';

export default {
  components: {
    CustomComponent
  }
};
</script>