Question

我正在使用试剂来开发一个网站。实际上，一般来说，我不清楚如何使用试剂中的触摸事件。我读过这篇文章 clojurescript: touch events and Domina，但我是否需要使用domina来处理试剂的触摸启动事件？任何人都有一段代码可以检测 - 给定一个dom元素 - 如果用户向左或向右滑动了％？

Answer 1

Reagent使用React的虚拟DOM和合成事件。触摸事件为available in React，但您必须在呈现任何组件之前（即在调用(.initializeTouchEvents js/React true)之前）调用reagent.core/render-component。

编辑：下面的代码无效，因为触摸事件比鼠标事件更复杂。有关（JS）示例，请参阅this MDN page。 React似乎实现了相同的触摸API。

对于滑动百分比，请执行以下操作（未经测试）：

(defn swipe-element []
  (let [swipe-state (atom {:width 0, :start-x 0, :current-x 0})]
    (fn []
      [:div {:on-touch-start 
             (fn [e]
               (reset! swipe-state {:width (.. e -target -offsetWidth)
                                    :start-x (.. e -target -pageX)
                                    :current-x (.. e -target -pageX)}))
             :on-touch-move
             (fn [e] 
               (swap! swipe-state assoc :current-x (.. e -target -pageX)))}
        (let [{:keys [width start-x current-x]} @swipe-state
              direction (if (> current-x start-x) "right" "left")]
          (str "Swipe " direction ": "
               (* (/ (.abs js/Math (- start-x current-x)) width) 100) "%")))))

触摸左/触摸试剂中的正确事件

1 个答案: