禁用左右滑动事件

Posted 2023-05-09

【中文标题】禁用左右滑动事件

【英文标题】：Disabling swipe left and right event

【发布时间】：2021-05-10 23:47:11

【问题描述】：

我将在网站移动视图上禁用滑动事件（滑块部分的左右滑动）。 这是我的js代码。

jQuery(document).on("swipeleft swiperight", '#sample_slider', function(e) 
    e.stopImmediatePropagation();
    e.preventDefault();
);

这不适用于#sample_slider 元素。

或者是否指向错误的滑动​​元素？

【问题讨论】：

点击时，切换一个状态（在data，我们称它为carSelected）然后在你的div上，创建一个v-if来检查carSelected是否为真，然后它就下来了其余部分为 html + css。

【参考方案1】：

使用 :hover css 属性并将pointer-events:none; 样式传递给元素，这应该可以解决问题 在您的 someAction() 函数中，您需要执行此操作

然而，作为一个开发者，像这样使用@click 事件是使用 Vue 的最愚蠢的方式。但考虑到您的应用程序可能需要这样做，我认为我的解决方案应该对您有所帮助

【讨论】：

不知道为什么它是愚蠢的。你的点击可以改变一个状态，它仍然是 Vue 的工作来处理反应性并允许将动态 CSS 应用于元素。

好吧，您将在输入元素上使用@click 执行什么样的操作，该输入元素已经嵌套在具有自己的@click 事件的div 下......

不确定为什么孩子和父母不能有 2 个单独的动作。它们可以完全不相关，具体取决于 UI。 Ofc，你需要防止传播，但这与 Vue 处理反应性并没有真正的关系。

特别是我的观点，如果它是一个孩子，把它放到一个不同的组件中并监听 div 上的一个动作并有一个@click，但是把它们放在一个文件中并且都有@click 是这不是一个明智的方式，它会导致冲突.. 这就是为什么我说“考虑到您的应用程序可能需要”

您不需要在不同的文件中将它们分开。您可以在同一个 .vue 文件中总共获得 20 个 @click。无论如何，将单个组件拆分为多个组件都不应该是一个经验法则。它应该是关于它的功能的逻辑，而不仅仅是“哦该死，还有一次点击，我需要把它踢到另一个文件中”。如果将其放入另一个文件中，也会有同样多的冲突。尽管如此，如果在 OP 的上下文中确实有意义的话，拥有一个父点击侦听器和一个子点击侦听器是完全可以的。