ZHANGREN

您的位置：主页 > 使用vue全家桶高仿小米商城--vuex框架搭建

advertisement

使用vue全家桶高仿小米商城--vuex框架搭建

作者：listener_zhang | 时间：2020-01-30 00:21 | 访问数： |

说到Vuex确实有点蒙蔽，但是希望经过这次的学习可以进一步加深对Vuex的理解，当然也可以在vue官网上面去看看文档，那么接下来就是我们这次学习的总结了。
架构搭建在项目时候我们在src下新建了一个叫store的文件夹，这个文件夹就是为vuex准备的，首先在下面新建三个js文件，命名分别是：index.js、action.js、mutations.js

index.js里面的代码如下：

import Vue from 'vue'
import Vuex from 'vuex'
import mutations from './mutations'
import action from './action';
Vue.use(Vuex)
const state = {
username:'', //登录用户名
cartCount:0 //购物车商品数量
}
export default new Vuex.Store({
state,
mutations,
action
});

action.js里面的代码如下：

//商品Vuex-actions
export default {
}

随后我们要在main.js里面引入并加载vuex，如下图所示：

随后打开浏览器里面的vue-devtools去查看写vuex是否搭建成功，下面是搭建成功的图：

标签： vue vue全家桶 vuex

zhangren.online

您可能喜欢

Vue打包后built files are meant to be served ov

Vue打包后built files are meant to be served ov

2019年03月21日查看： 184

Vue项目碰到＂‘webpack-dev-server’不是内

Vue项目碰到＂‘webpack-dev-server’不是内

2019年06月05日查看： 96

使用vue全家桶高仿小米商城--订单父组件

使用vue全家桶高仿小米商城--订单父组件

2020年02月06日查看： 145

使用vue全家桶高仿小米商城--产品站交互

使用vue全家桶高仿小米商城--产品站交互

2020年02月02日查看： 189

使用vue全家桶高仿小米商城--Mock设置

使用vue全家桶高仿小米商城--Mock设置

2020年01月29日查看： 84

使用vue全家桶高仿小米商城--前端主要的

使用vue全家桶高仿小米商城--前端主要的

2020年01月29日查看： 130

回到顶部