您的当前位置:首页正文

Nuxt3的plugins使用有哪些?

来源:九壹网

Nuxt3是一个服务端渲染(ssr)框架在项目中,

(1)有一些全局使用方法,不想每次使用都要单独导入,而不想像平时的框架项目,总是要export,然后频繁的 import,现在nuxt3可以用plugins的provide注入全局方法,但是其实不同于Vue的provide

  Nuxtprovide: 可注入全局方法 解决全局方法多处导入问题

 Vueprovide解决组件传值问题(如果组件层级很深,每个组件都依赖于最外层的数据【比如:有一个产品线,里面所有的操作组件或者模块都依赖于产品数据】,那么可以使用provide),注入的是变量值,在外层组件注入,里面所有的子组件,嵌套子组件等所有包含在这个最外层组件里的组件皆可使用该注入数据

(2)平时开发项目中,是不是经常有一些插件(比如UI库插件)、全局方法想要全局使用,而不想多次单独导入(方便快捷,一次引入,多处可方便使用)
(3)有一些文件只想在服务端或者客户端执行,Nutx的pugins还可以通过文件后缀(.client/.server)来配置是在服务端还是客户端执行该文件,其中plugins文件夹下的所有文件会自动在客户端渲染之前自动引入

1、可以注入全局方法

使用如下:

2、引UI组件等

(1)安装依赖

npm  @ant-design-vue/nuxt --save-dev

或者yarn  @ant-design-vue/nuxt --save-dev

(2)在nuxt.config,ts中配置

全局直接使用

(3)按需引入(如果用到的组件不多的情况下建议按需引入)

3、创建只在client /server端执行的文件

因篇幅问题不能全部显示,请点此查看更多更全内容

Top