常规NPM软件包在Vue.js应用程序中不起作用

vue.js Vue.js

猪猪

2020-04-03

我正在尝试/ 应用程序中使用NPM包滚动缓和效率,因此我创建了一个文件部分中指定的名为in 文件夹文件。NuxtVuescroll-ease-efficient.client.jsplugins/pluginsnuxt.config.js

这是文件的内容:

import Vue from 'vue'
import { scrollTo } from 'scroll-ease-efficient'
Vue.use(scrollTo)

然后在我的应用程序中,我只是做:

const scrollEle = document.getElementById('element')
scrollTo(scrollEle, 500)

这应该可以,但是它什么也没做,而且我也没有控制台错误。

怎么了?

第3935篇《常规NPM软件包在Vue.js应用程序中不起作用》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

1个回答
小小 2020.04.03

感谢您的询问。但是首先,让我澄清一下。并非所有npm软件包都打算使用Vue / Nuxt插件方法安装。这种方式的常规npm软件包名称通常包含单词vue / nuxt,例如VuetifyVuefire

而且scroll-ease-efficient包不是vue也不是nuxt插件。因此,为了使用此程序包,您可以将该程序包中的全局api添加到vue或nuxt构造函数中。

import Vue from "vue";
import { scrollTo } from "scroll-ease-efficient";

Vue.prototype.$scrollTo = scrollTo;

现在,您可以通过以下方式访问全局方法 this.$scrollTo()


编辑

请查看此演示的链接:https : //codesandbox.io/s/vue-scroll-ease-ficient-demo-8tqmj

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android