Question

我遇到问题，我试图解决，但没有结果。

我安装了vue-fullpage，并导入了它和CSS。

但是我有下一个错误

Unknown custom element: <full-page>

如果我检查“ app.js”，则将加载Vue组件的整页内容，但仍然无法正常工作

代码：

<template>
  <div>
    <full-page :options="options" id="fulp" ref="fullpage">
      <div class="section">
        <h3>vue-fullpage.js</h3>
      </div>
      <div class="section">
        <div class="slide">
          <h3>Slide 2.1</h3>
        </div>
        <div class="slide">
          <h3>Slide 2.2</h3>
        </div>
        <div class="slide">
          <h3>Slide 2.3</h3>
        </div>
      </div>
      <div class="section">
        <h3>Section 3</h3>
      </div>
    </full-page>
  </div>
</template>

<script> 
 import FullPage from 'vue-fullpage.js'


  export default {
    name: 'Test full page',
    data() {
      return {
        options: {
          navigation: true,
          anchors: ['page1', 'page2', 'page3'],
          sectionsColor: ['#41b883', '#ff5f45', '#0798ec', '#fec401', '#1bcee6', '#ee1a59', '#2c3e4f', '#ba5be9',
            '#b4b8ab'
          ]
        },
      }
    },

  }

</script>

<style>
  @import 'https://unpkg.com/fullpage.js/dist/fullpage.min.css';

</style>

更新：我也试着把attr组件：

export default {
        name: 'Test full page',
        components: {FullPage},
        data() {
          return {
            options: {
              navigation: true,
              anchors: ['page1', 'page2', 'page3'],
              sectionsColor: ['#41b883', '#ff5f45', '#0798ec', '#fec401', '#1bcee6', '#ee1a59', '#2c3e4f', '#ba5be9',
                '#b4b8ab'
              ]
            },
          }
        },

但是我收到“ Vue.component不是函数”的其他错误

有什么想法吗？

Answer 1

根据他们的指南，您似乎没有使用vue-fullpage.js库。

它们将库作为Vue插件提供，因此您需要在根Vue实例（例如

）中使用

// main.js or whatever
import Vue from 'vue'
import VueRouter from 'vue-router'
import VueFullPage from 'vue-fullpage.js'

Vue.use(VueRouter) // Note: Do NOT try and pass in multiple plugins
Vue.use(VueFullPage)

这将在全局安装full-page组件，因此您无需将其导入到您的组件中。

Vue整页未知元素

1 个答案: