当前位置: 代码迷 >> 综合 >> 对 nuxt 插件的理解
  详细解决方案

对 nuxt 插件的理解

热度:56   发布时间:2023-12-15 07:45:14.0

nuxt 没有main.js 文件了,

所以要想在根实例里面的钩子函数中添加代码就很麻烦,比如,你想添加一个监听刷新的事件,这个事件只能在根实例的钩子函数里面添加。

为什么呢?

因为,如果是网页的话,你不是监听的当前这个组件的刷新事件,你是监听整个app 的刷新事件,不论哪个组件显示在屏幕上都应该存在这个监听事件。所以应该在app 初始化完成后(根实例的mounted)的mouted 中添加监听代码,如果是在某个组件中添加的话,如果没有打开这个组件就不会执行代码,当前app 就没有监听事件。

那么有人说了,为什么不在主页的 组件里面添加这个代码呢,

因为,如果别人没有进入主页呢?而是通过搜索引擎直接进入了其他的vue组件了,那么这个app 还是没有这个监听事件。

 

2 插件里面接收了一个context 上下文对象,对象中有 vue 根实例,所以你可以对根实例为所欲为,比如在根实例中添加原型,

在根实例中添加全局组件,在根实例总注册全局自定义指令,等等。

 

3  这样基本上main 的js 中能做的,这里都能做了,因为main.js 中也就是有一个 vue 根实例对象,你可以在根实例对象上做点手脚,等到根实例执行的时候这个也能执行。

 

4 如果你根本不需要根实例 vue , 你只是想像在 main.js 里引入一个外部自定义js 文件那样,就是想在项目初始化的时候执行下文件里的一段代码,那么插件也能做到,你要做的就是定义一个js 文件,然后注册插件,然后,nuxt 会自动把你的代码编译到main,js 文件里面(可以这么理解,事实不一定是这样。)

5 唯一不能做的,我现在还不知道的就是没有办法获取根实例的生命周期函数,因为有些代码要在声明周期函数里面执行才可以。