vue2尚品汇学到得新知识

vue滚动条  写到router路由中，回到最顶部
scrollBehavior(to, from, savedPosition) {
        return { y: 0 };
    }

2.
引入一个模块后，先在路由router中，import然后再在注册路由写信息（path后看看要不要带参数），再写获取数据api，并暴露，然后再注册vuex（state，actions，mutation），最后引入到vuex得index中并且暴露，再派发获取信息得接口mounted（）{this.$store.dispatch('')}，拿到数据然后再获取...mapgetters\...mapState，获取数据放在页面中
传递数据：
父传子：props，现在父亲页面中得子标签：名字=“值”，再在子组件中props：【‘’】（数组方式）
兄弟之间：全局事件总线$bus
传递的：this.$bus.$emit('函数名'，数据）
接收的：this.$bus.$on('函数名，callback)

3.加入购物车后，前台把参数带给服务器，服务器并没有返回其他数据，不需要三连环存储数据（不需要写mutation、getters等
加入购物车成功还是失败，进行响应的操作，promise操作，前台加入购物车要通知服务器，
跳转到购物车页面要传递参数，显示购物车里的东西！！用到了本地存储~（也可以跳转的时候传参，就是页面地址栏不好看），一些简单的数据可以通过query给路由组件传递过去，通过会话存储
html5新增了本地存储和会话存储，localstorage、sessionstorage，产品的信息比较复杂

获取购物车数据：用到sessionstorage，在获取数据的页面写setItem（）因为是字符串 用json转换为对象，然后再在购物车页面写getItem，获取数据

给标签单向绑定的时候，一定要有变化的值才绑定

写结算页面的时候要获取服务器的数据，三联，写接口，发请求，获取数据，展示数据

4.uuid生成游客数据，好难好复杂救命，在添加购物车的时候考虑到每个账号的购物车都不一样，所以模拟一下，先随机生成了字符串，引入额uuid.js，暴露了一个函数，获取uuid，先从本地获取看有没有，没有就生成一个，存储localstorage.setItem，最后返回uuid，再在购物车中引入，在state中创建uuid：getUUID（），把uuid'在请求头中传递给用户，在api请求拦截器中，添加一个新的属性为uuid，

5.计算属性就是一个简化数据的地方，可以拿了数据...mapstate然后直接在计算属性创建一个函数，返回简化之后的数据

6.删除购物车

7.改变购物车中选中物品的状态isChecked，接口、仓库、三连环

8.删除选中的产品，派发了一个action（try catch派发），然后在store中action中访问dispatch和getters，为了获取购物车中的产品，遍历然后调用多次删除购物车产品（这里多次删除还是派发以前写的方法！

9.注册业务、登录三连环也是。。。登录这里有一个token（用户的唯一标识）获取用户信息，用token向服务器要用户信息(api),登录是在home中，挂载完毕加载登录，需要携带token所以在请求拦截器中判断token！！axios我不懂（美学啊要学一下啊）vuex存的数据不是持久化的，token是服务器给的，要存储token

注册完成要登录，用户名+密码，向服务器发请求，登陆成功获取token，但是vuex不是持久化的，所以当用户登陆成功获取到token要localstorage一下，可以暴漏一个函数存储token，用的时候再引入，但是再次刷新的时候还是没有，因为没用他，要用的化就是再state中再次getItem，但是发现只有在home组件中才派发这个方法，在search中没有，
问题：多个组件都要用用户信息，需要在每个组件munted时候派发

10.导航守卫，
导航：路由正在发生变化      
守卫： 
全局守卫：只要路由变化，守卫就能监听到。全局守卫分为前置守卫、后置守卫、
路由独享守卫：
组件内守卫：
路由的跳转是由条件的，比如用户已经登陆就不该回到login页面，设置一个全局前置守卫，在router中router.beforeEach((to, from, next) => {
    //next放行函数 next('/home') 放行到指定路由
    //next（false）中断当前的路由
    next()
然后根据路由跳转的情况进行放行。。。

11.交易 提交订单
做完三件套，然后把数据引到页面中，用mapState，然后遍历引入{{}}，选择收货人的时候用排他思想
changDefault(address,addressInfo){
        addressInfo.forEach(item=>item.isDefault=0)
        address.isDefault=1
      }，有条件的添加类名用:class="{selected:address.isDefault==1}"，当默认为1的时候添加这个select类，然后总结收件人的时候先用计算属性
userDefalutAddress(){
        return this.addressInfo.find(item=>item.isDefault==1)
      }
简化一下数据，然后就可以直接渲染页面啦！

12.如果有了接口，不用vuex存储数据，可以再main中统一引入所有的api，然后挂载再vue原型上prototype，像全局总线bus一样使用，就是派发的时候由dispatch变成了this.$API.reqPayInfo(this.orderId)
它的参数调用this.$route.query.orderId

13.弹窗用了elementui，然后微信支付用了qrcode生成二维码

14.个人中心二级路由，就是点击左侧的出现右侧的，所以把右侧拆分二级路由，先拆开 ，然后在center中引入两个子路由，import+component，然后再在router里注册，import+在path中加入
children: [
                {
                    //不用写/，要不然就写全把/center也带上
                    path: 'myorder',
                    component: MyOrder
                },
最后在父路由中<router-link to="/center/myorder">，在应该显示子路由的位置写<router-view>

15.获取个人中心的数据进行分页展示！就是一直发请求

16.个人中心封装组件了：分页器和加日历！！！！

17.路由守卫，登陆了才能交易。。
路由独享守卫：
只有从购物车页面才能跳转到交易页面

18.图片懒加载 引入插件

19.路由懒加载 按需引入
在router配置路由信息的时候，component：（）=>import('/...'),把import给删除了

20.打包上限。