nuxt将全局组件以及方法等挂载同意放在了plugins中, 以文件作为区分:
例如,想要在此项目中全局挂载antd,那我需要在plugins下新建一个js文件,文件名随意,暂且叫antd-ui.js
吧,里面的内容为:
import Vue from 'vue';
import Antd from 'ant-design-vue/lib';
Vue.use(Antd);
然后需要在nuxt.config.js
中配置plugins
:
export default {
plugins: [
'@/plugins/antd-ui',
]
}
这样就可以全局使用antd的组件了,我测试了方法也是一样:
plugins下新建methods.js文件
编写methods.js文件:
import Vue from 'vue';
Vue.prototype.$test = function(str) {
console.log('This is a test plugin public method: ', str);
}
随后在nuxt.config.js中的plugins下添加一项'@/plugins/methods'
随后就可以在项目中使用$test('xx')了
如在页面中的mounted中执行this.$test('xxx');
由此,之前vue的挂载问题也解决了,不由得感慨一句:这文件分类分得我心里好爽!