vue main.js中引入js_基于 vue+fullpage.js 超丝滑的滚屏组件Vue-Fullpage

今天给小伙伴们推荐一款超棒的Vue自由屏幕滚动组件VueFullPage。

vue-fullpage 一个基于 fullpage.js 官方推出的vue全屏滚动组件，在vue页面即可制作FullPage滚动效果。

安装

$ npm i vue-fullpage.js -S

引入

# 在main.js引入组件import Vue from 'vue'import 'fullpage.js/vendors/scrolloverflow' // Optional. When using scrollOverflow:trueimport './fullpage.scrollHorizontally.min' // Optional. When using fullpage extensionsimport VueFullPage from 'vue-fullpage.js'Vue.use(VueFullPage);

使用插件

Section 1

Section 2

Section 3

最后贴上演示示例及仓库链接

# 示例地址https://alvarotrigo.com/vue-fullpage/# 仓库地址https://github.com/alvarotrigo/vue-fullpage.js

ok，就分享到这里。如果小伙伴们有更好的vue滚屏组件，欢迎留言一起交流讨论。