Fullpage Scroll für Vue?

Question

Gibt es eine analoge Bibliothek fullpage.js für Vue? Benötigen Sie eine Komponente, die durch Komponenten sowie für fullpage.js scrollen kann.

Answer 1

Jetzt können Sie auch die Verwendung von the official fullpage.js component for Vue.js

Answer 2

Vielleicht können Sie eine directive dafür in Betracht ziehen.

Erste Ladung jquery und fullpage.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
<script type="text/javascript" src="https://cdn.jsdelivr.net/jquery.fullpage/2.9.4/jquery.fullpage.min.js"></script> 

Dann erstellen Sie eine neue Anweisung.

Vue.directive('fullpage', function(el, binding) { 
    $(el).fullpage(binding.value) 
}) 

Beispiel Nutzung:

<div v-fullpage="fullpageOptions"> 
    ... 
</div> 

In Ihrer Komponente:

data: { 
    return { 
    fullpageOptions: { 
     sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE', 'whitesmoke', '#ccddff'], 
     anchors: ['firstPage', 'secondPage', '3rdPage', '4thpage', 'lastPage'], 
     menu: '#menu', 
     css3: true, 
     scrollingSpeed: 1000 
    } 
    } 
}