版权声明:写文章辛苦,请不要复制粘贴,如果要,请注明来处 https://blog.csdn.net/u012627861/article/details/87888697
Nuxt搭建
通过脚手架可以很方便的搭建,具体信息参考《安装 - Nuxt.js》
安装时会要求选择Web服务器,我这里选择的是express。插件选择时推荐勾选上prettier、lint,其他的自行处理。有空在做详细说明。
Nuxt整合Vuex
在store目录下创建index.js如下
export const state = () => ({})
export const mutations = {}
export const actions = {}
export const getters = {}
这样将自动激活Vuex,激活后,store目录下所有的js文件,都会被导入至state、mutations、actions、getters,前提是js满足以下条件:
- 要么js文件名称为state.js、mutations.js、actions.js或getters.js
- 要么js文件通过export const state、export const mutations、export const actions、export const getters语句来导出这些对象和方法
关于模块定义
比如我们拥有订单模块,业务比较复杂,那我们可以创建order目录,在目录下创建state.js、mutations.js、actions.js和getters.js(需要什么就创建什么),这样可以通过this.$store.state.order来访问state,通过order/mutationName,order/actionName来调用mutations和actions。getter暂时没调用过!如果一个页面业务不复杂,比如用户模块,那么我们就可以直接创建user.js,通过export导出state, mutations, actions, getters即可,如下
store
- order
- state.js
- mutations.js
- actions.js
- getters.js
index.js
user.js
user.js如下
export const state = () => ({})
export const mutations = {}
export const actions = {}
export const getters = {}