Javascript 如何将客户端脚本添加到Nuxt.js？

我一直在阅读Nuxt.js关于插件的文档和用于添加脚本的config Nuxt文件。我两个都试过了，但都不走运

我正在尝试添加以下代码（位于

/static/js/scripts.js

）：

有人能帮我吗

在常规HTML使用中，我只是在结束正文标记之前做脚本标记（为了用户体验）。我能够将

scripts.js

加载到Vue.js 2.0框架中，但一旦我将所有内容移动到Nuxt.js，并尝试将其调整到Nuxt.js，除了

scripts.js

文件之外，其他所有内容都正常工作。

[SOLVED]

我知道了！我不得不重新参考Vue.js文档，因为Nuxt.js文档对我没有任何帮助

因此，我基本上进入了vue文件，其中包含我希望该类切换显示在基于scroll的导航栏中。我还必须修改javascript，使其对ESLINT友好。。。因此，下面的代码与我在问题中所写的代码相同

<script>
export default {
  name: 'MainNav',
  data: function () {
    return {
      fixedOnScroll: false
    }
  },
  methods: {
    handleScroll () {
      if (window.scrollY >= 200) {
        this.fixedOnScroll = true
      } else {
        this.fixedOnScroll = false
      }
    }
  },
  created () {
    if (process.browser) {
      window.addEventListener('scroll', this.handleScroll)
    }
  },
  beforeUpdate () {
    if (process.browser) {
      window.addEventListener('scroll', this.handleScroll)
    }
  }
}
</script>

导出默认值{
名称：'MainNav'，
数据：函数（）{
返回{
fixedOnScroll:false
}
},
方法：{
handleScroll（）{
如果（window.scrollY>=200）{
this.fixedenscroll=true
}否则{
this.fixedenscroll=false
}
}
},
创建（）{
if（process.browser）{
window.addEventListener（'scroll'，this.handleScroll）
}
},
更新之前（）{
if（process.browser）{
window.addEventListener（'scroll'，this.handleScroll）
}
}
}

一旦解决了这个问题，我必须在同一个文件的模板标记中使用vue绑定类

<nav class = "navbar-expand-lg text-center" v-bind:class="{ 'fixed-header': fixedOnScroll }">

---

从那以后一切都很顺利

Nuxt v1.4.0文档中的官方指南如下：

如果您需要指定 如果只想在客户端导入资源，则需要使用 process.browser变量

例如，在.vue文件中：

if (process.browser) {
  require('external_library')
}

如果在多个文件中使用此库，我们建议 您可以通过nuxt.config.js将其添加到供应商包中：

build: {
  vendor: ['external_library']
}

build: {
  vendor: ['external_library']
}