vuex学习day01-vuex简述、基于脚手架创建项目、基于脚手架创建项目

 1、vuex简述

之所以采用vuex是因为当我们有多个公共状态的组件时，vue的简单性容易崩溃

（1）概念

Vuex 是Vue.js 应用程序的状态管理模式+库。简单讲，vuex是vue的一个状态管理工具。

（2）作用

管理vue中的多个组件共享的数据

（3）应用

1）某些数据在多个组件中使用

2）多个组件共同维护一份数据

（4）优点

1）多个组件共同维护一份数据，易于数据的集中化管理

2）响应式变化

3）操作简洁（他提供了一些辅助函数）

2、基于脚手架创建项目

（1）通过（vue create 自定义名称）语句，创建项目

回车：

（2）选择（Manually select features）自定义创建

回车：

（3）选择配置项（Babel、CSS Pre-processors、Linter）（通过空格选择）

回车：

（4）选择vue的版本（vue2）

回车：

（5）选择CSS的预处理器（CSS Pre-processors）（选Less）

回车：

（6）选择一个过滤器/格式化器配置（ESLint）

回车：

（7）选择额外的过滤器功能（Lint）

回车：

（8）选配置的位置，In dedlicated config files（在指定的配置文件中）

回车：

（9）是否将其保存为将来项目的预设？不保存

回车：

成功（这里出现Failed to check for updates，是因为切换成了淘宝镜像源，只要可以成功安装，都不影响）：

查看镜像源：npm config get registry

使用原镜像源：npm config set registry https://registry.npmjs.org

使用淘宝镜像源npm config set registry https://registry.npm.taobao.org：

（10）进入项目，执行起来

（出现local即为成功）

（11）通过VSCode打开项目

（12）修整项目内容（利用组件局部注册完成）

部分代码：

3、创建仓库

（1）安装vuex3（遵循233,344规则vue2（3）、路由3（4）、vuex3（4）），通过（npm install vuex@3或yarn add vuex@3）安装

（2）新建仓库文件夹（store）和index.js文件，定义vuex，单独存放安装插件和创建仓库的代码

（3）安装vuex插件，创建空仓库

（4）将仓库挂载到main.js的Vue实例上

（5）检验仓库是否创建成功

创建成功之后可以在任意组件访问到

找个组件在控制台打印一下

（成功！）