vue1-day9

vuex

概念：
vuex是Vue配套的公共数据管理工具，它可以把一些共享的数据，保存到vuex中，方便整个程序中的任何组件直接获取或者修改我们的公共数据。

vuex是为了保存组件之间共享数据而诞生的，如果组件之间有要共享的数据，可以直接挂载到vuex中，而不必通过父子组件之间传值了，如果组件的数据不需要共享，此时这些不需要共享的私有数据，没有必要传到vuex；
只有共享的数据，才有权力放到vuex中去，组件内部私有的数据，只要放到组件的data中即可

props（组件传递过来的数据）和data（私有数据）区别，vuex（共享数据）

得出一个结论：vuex是一个全局的共享数据存储区域，就相当于是一个数据的仓库；
如果在组件中想要访问store中的数据，只能通过this.$store.state.***
大奖vuex挂载到vm实例上，类似于router来进行挂载一样，只要挂载到了vm上，任何组件都能使用store来访问数据
如果要操作store中的state值，只能通过调用mutations提供的方法，才能操作对应的数据，不推荐直接操作state中的数据，因为万一导致了数据的紊乱，不能快速定位到错误的愿意你，因为每个组件都可能有操作数据的方法

如果组件想要调用mutations中的方法，只能调用$this.store.commit(‘方法名’)来进行调用

在mutations中最多只能支持两个参数，如果想要传多个参数，则可以使用对象方式来传参

getters只负责对外提供数据，不负责修改数据，如果想要修改state中的数据，请去mutations/经过回顾对比，发现getters中的方法，和组件中的过滤器比较类似，因为过滤器和getters都没有修改原数据，都是把原数据做了一层包装，提供给了调用者。其次getters也和computed比较像，只要state中的数据发生变化了，那么如果getters正好也引用了这个数据那么就会立即触发getters重新求值

总结：
1、state中的数据，不能直接修改，如果想要修改，必须通过mutations
2、如果组件想要直接从state上获取数据：需要this.$store.state.*
3、入宫组件想要修改数据，必须使用mutations提供的方法，需要通过this.$store.commit（‘方法名’，唯一的一个参数）
4、如果store中state上的数据，在对外提供的时候，需要做一层包装，那么，推荐使用getters，如果需要使用getters，则用this.$store.getters.*

开启Apache的gzip压缩

要让apache支持gzip功能，要用到deflate_Module和headers_module。打开apache的配置文件httpd.conf，大约在105行左右，找到以下两行内容：（这两行不是连续在一起的）

#LoadModule deflate_module modules/mod_deflate.so
#LoadModule headers_Module modules/mod_headers.so

然后将其前面的“#”注释删掉，表示开启gzip压缩功能。开启以后还需要进行相关配置。在http.conf文件的最后添加以下内容即可：

<IFModule deflate_module>
#必须的，就像一个开关一样，告诉apache对传输到浏览器的内容进行压缩
SetOutputFilter DEEFLATE
DeflateCompressionLevel 9
</IFModule deflate_module>

最少需要加上以上内容，才可以gzip功能生效，由于没有做其他额外配置，所以其他相关的配置均使用Appache的默认设置。这里说一下参数“DeflateCompressionLevel”，它表示压缩级别，值从1到9，值越大表示压缩的越厉害

使用ngrok将本机映射为一个外网的web服务器

注意：由于默认使用的美国的服务器中间转接，所以访问速度超级慢，访问时可直接启用FQ软件，提高网页打开速度。