美团meituan 2.0 vuejs项目记录

<h2>Summary of project questions 项目问题点总结：</h2>

 

一,touch的使用

 

    以下是四种touch事件

 

    touchstart: //手指放到屏幕上时触发

 

    touchmove: //手指在屏幕上滑动式触发

 

    touchend: //手指离开屏幕时触发

 

    touchcancel: //系统取消touch事件的时候触发，这个好像比较少用

    每个触摸事件被触发后，会生成一个event对象，event对象里额外包括以下三个触摸列表

 

    touches: //当前屏幕上所有手指的列表

 

    targetTouches: //当前dom元素上手指的列表，尽量使用这个代替touches

 

    changedTouches: //涉及当前事件的手指的列表，尽量使用这个代替touches

 

    这些列表里的每次触摸由touch对象组成，touch对象里包含着触摸信息，主要属性如下：

 

    clientX / clientY: //触摸点相对浏览器窗口的位置

 

    screenX / screenY 相对于屏幕的 x 和 y 坐标

 

    pageX / pageY: //触摸点相对于页面的位置

 

    screenX / screenY: //触摸点相对于屏幕的位置

 

    identifier: //touch对象的ID

 

    target: //当前的DOM元素

 

    ev.preventDefault();//阻止事件相关的的默认行为

    注意：

 

    手指在滑动整个屏幕时，会影响浏览器的行为，比如滚动和缩放。

    所以在调用touch事件时，要注意禁止缩放和滚动。

    参考文章：http://www.jintiankansha.me/t/llgywQvL2V

 

二、VUEX的学习 2018-6-16

    1.vuex理解为一个核心数据库 store 适用与中大型应用

    2.state: 访问状态对象 一般为常量 数据 不变的

    3.mutations：触发状态 用commit触发 同步操作

     3.1mutations-type mutationsde名字 存储一些mutations相关的常量

    例如： <buttom @click="$store.commit('jia')">+</buttom>

            <buttom @click="$store.commit('jian')">-</buttom>

    4.  简化一个计算属性的写法

    import {mapState} form 'vuex'   

     computed:mapState({

         **:function(state) {

             return state.** +2

         }

     })

     ES6写法：**：state=>state.**

 

     如果更加麻烦 可以用数组的方式写

     computed:mapState([

        "**"

     ])

     mapState直接这样写需要安装一个插件 但是直接在前面+...就可以了 =》...mapState

     5.mapMutations

     methods:{

        ...mapMutations([

     '**'

        ])

        ...mapActions([])

     }

     6.getter获取则（映射&#