javascript - vue中怎么用AlloyFinger?
巴扎黑
巴扎黑 2017-04-11 11:34:08
[JavaScript讨论组]

vue里面如何引入触屏的AlloyFinger啊,看了官方的也不会弄,有报错,下面是我的代码:

// main.js
import Vue from 'vue'
import App from './App'
// 下面两种都试了,都报错
// import AlloyFingerVue from 'AlloyFinger'
// Vue.use(AlloyFingerVue)
import AlloyFinger from 'AlloyFinger'
Vue.use(AlloyFinger)

/* eslint-disable no-new */
new Vue({
  el: '#app',
  template: '',
  components: { App }
})

报错信息

巴扎黑
巴扎黑

全部回复(2)
黄舟

不是给你用法了吗

Vue.use(AlloyFingerVue); // use AlloyFinger's plugin

var h = new Vue({
    el: '#cnt',
    methods: {
        tap: function() { console.log('onTap'); },
        multipointStart: function() { console.log('onMultipointStart'); },
        longTap: function() { console.log('onLongTap'); },
        swipe: function(evt) {
            console.log("swipe" + evt.direction);
            console.log('onSwipe');
        },
        pinch: function(evt) { 
            console.log(evt.scale);
            console.log('onPinch'); 
        },
        rotate: function(evt) {
            console.log(evt.angle);
            console.log('onRotate'); 
        },
        pressMove: function(evt) { 
            console.log(evt.deltaX);
            console.log(evt.deltaY);
            console.log('onPressMove'); 
        },
        multipointEnd: function() { console.log('onMultipointEnd'); },
        doubleTap: function() { console.log('onDoubleTap'); },
        singleTap: function () { console.log('onSingleTap'); },

        touchStart: function() { console.log('onTouchStart'); },
        touchMove: function() { console.log('onTouchMove'); },
        touchEnd: function() { console.log('onTouchEnd'); },
        touchCancel: function() { console.log('onTouchCancel'); }
    }
});

你还需要创建一个 vue 实例,

高洛峰
/* eslint-disable no-unused-vars */
import AlloyFinger from 'alloyfinger/alloy_finger' // 手势库
import AlloyFingerVue from 'alloyfinger/vue/alloy_finger.vue'
Vue.use(AlloyFingerVue, {
  AlloyFinger
})
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号