javascript - Materialise 轮播箭头在移动设备上不起作用

Question

我有一个使用 Materialize 的全 Angular 轮播，其中有一些箭头指示下一个和上一个轮播元素。在桌面上运行良好，但在移动设备上不起作用。我一直在研究它，据说这个元素存在一个他们没有掩盖的错误(毫不奇怪)。我想知道是否有人遇到过类似的问题并知道解决方法？以下代码适用于一个人，但不适用于我:

function setupEvents() {
    if (typeof window.ontouchstart !== 'undefined') {
        view.on('touchstart.carousel', tap);
        view.on('touchmove.carousel', drag);
        view.on('touchend.carousel', release);
    }
    view.on('mousedown.carousel', tap);
    view.on('mousemove.carousel', drag);
    view.on('mouseup.carousel', release);
    view.on('mouseleave.carousel', release);
    view.on('click.carousel', click);
}

在移动设备上，可以拖动它，但无法通过单击按钮启动。

Answer 1

您需要替换 materialize.js (0.100.2) 中的该代码段

在本地托管具体化文件，以便您可以自定义它。

在其中搜索此实现。

function setupEvents() {
    if (typeof window.ontouchstart !== 'undefined') {
        view.on('touchstart.carousel', tap);
        view.on('touchmove.carousel', drag);
        view.on('touchend.carousel', release);
    }
    view.on('mousedown.carousel', tap);
    view.on('mousemove.carousel', drag);
    view.on('mouseup.carousel', release);
    view.on('mouseleave.carousel', release);
    view.on('click.carousel', click);
}

将上面的代码 ^ 替换为下面给出的代码:

function setupEvents() {
    if (typeof window.ontouchstart !== 'undefined') {
       view[0].addEventListener('touchstart', tap);
       view[0].addEventListener('touchmove', drag);
       view[0].addEventListener('touchend', release);
    }
    view[0].addEventListener('mousedown', tap);
    view[0].addEventListener('mousemove', drag);
    view[0].addEventListener('mouseup', release);
    view[0].addEventListener('mouseleave', release);
    view[0].addEventListener('click', click);
}

现在一切都应该按预期工作。

引用并感谢 ddiaz914 的修复。 github issue #5052