uni-app 事件
    左侧为web事件,右侧为对应uni-app事件

    1. {
    2. click: 'tap',
    3. touchstart: 'touchstart',
    4. touchmove: 'touchmove',
    5. touchcancel: 'touchcancel',
    6. touchend: 'touchend',
    7. tap: 'tap',
    8. longtap: 'longtap',
    9. input: 'input',
    10. change: 'change',
    11. submit: 'submit',
    12. blur: 'blur',
    13. focus: 'focus',
    14. reset: 'reset',
    15. confirm: 'confirm',
    16. columnchange: 'columnchange',
    17. linechange: 'linechange',
    18. error: 'error',
    19. scrolltoupper: 'scrolltoupper',
    20. scrolltolower: 'scrolltolower',
    21. scroll: 'scroll'
    22. }

    在 input 和 textarea 中 change 事件会被转为 blur 事件。
    踩坑注意:
    上列表中没有的原生事件也可以使用,例如map组件的regionchange 事件直接在组件上写成 @regionchange,同时这个事件也非常特殊,它的 event type 有 begin 和 end 两个,导致我们无法在handleProxy 中区分到底是什么事件,所以你在监听此类事件的时候同时监听事件名和事件类型既
    平台差异所致,bind 和 catch 事件同时绑定时候,只会触发 bind ,catch 不会被触发,要避免踩坑。
    事件修饰符

    stop 的使用会阻止冒泡,但是同时绑定了一个非冒泡事件,会导致该元素上的 catchEventName 失效!
    prevent 可以直接干掉,因为uni-app里没有什么默认事件,比如 submit 并不会跳转页面
    self 没有可以判断的标识
    once 也不能做,因为uni-app没有 removeEventListener, 虽然可以直接在 handleProxy 中处理,但非常的不优雅,违背了原意,暂不考虑
    按键修饰符:uni-app运行在手机端,没有键盘事件,所以不支持按键修饰符。

    事件绑定:@click

    1. <template>
    2. <view class="demo" @click="clickTest" @longtap="longtap"></view>
    3. </template>
    4. <script>
    5. export default {
    6. methods:{
    7. clickTest: function(e){
    8. console.log(e);
    9. console.log('click');
    10. },
    11. longtap: function(e){
    12. console.log(e);
    13. console.log('longtap');
    14. }
    15. }
    16. }
    17. </script>
    18. <style>
    19. .demo{width:500px; margin:50px auto; background:#8F8F90; height:500px;}
    20. </style>

    事件传参(动态参数演示)

    1. <template>
    2. <view>
    3. <view v-for="(item, index) in students" class="persons" @click="menuClick" v-bind:id="index">{{index}} - {{item.name}}</view>
    4. </view>
    5. </template>
    6. <script>
    7. export default {
    8. data: {
    9. return{
    10. students : [
    11. {name : "张三", age : 18},
    12. {name : "李四", age : 20}
    13. ]
    14. }
    15. },
    16. methods:{
    17. menuClick : function(e){
    18. console.log(e);
    19. console.log(e.target.id);
    20. }
    21. },
    22. }
    23. </script>
    24. <style>
    25. .persons{width:750px; line-height:2.2em;}
    26. </style>