Question

我有一个svg元素，我在onMouseDown，OnMouseMove和onMouseUp上做。我的问题是，只要用户在按住鼠标按钮的同时离开元素，它就不会注册鼠标移动。我想在用户离开元素后保持onMouseMove事件。

这是我的代码：

def main():
     Array = [10, 5, 3, 8, 6, 7, 4, 9, 2, 1, 10]
     quicksort(Array)

     print Array

def quicksort(a):
    quicksort_sort(a, 0, len(a))
    return a

def quicksort_sort(a, left, right):
    if left + 1 < right:
        ipivot = quicksort_part(a, left, right)    
        quicksort_sort(a, left, ipivot)
        quicksort_sort(a, ipivot + 1, right)

def quicksort_part(a, left, right):
    pivot = a[left]
    i = left + 1

    for j in range(left + 1, right):
        if a[j] <= pivot:
            a[j], a[i] = a[i], a[j]
            i += 1

    a -= 1
    a[left], a[i] = a[i], a[left] 

    return i

main()

我也试过onDragStart，onDrag这些都不行。我正在使用es6。

Answer 1

以下是您的代码示例，其中显示了如何使用容器注册该圈子之外的事件。

您应该考虑在拖动开始时订阅move事件，并在拖动结束时再次取消订阅，以防止发生大量事件。但这应该让你开始。

＆＃13;

class School extends React.Component {
  onDragStartCircle = (e) => {
    console.log('drag start')
  }
  onDragCircle = () => {
   console.log('move')
  }
  onDragEndCircle = () => {
    console.log('drag end')
  }
  render() {
    return (
      <div class="container" 
        onMouseMove={this.onDragCircle}
        onMouseUp={this.onDragEndCircle}>
        <svg>
          <circle
            cx={50}
            cy={50}
            r={10} 
            fill="red"
            onMouseDown={this.onDragStartCircle}
            
           />
        </svg>
      </div>
    );
  }
}


ReactDOM.render(
  <School />,
  document.getElementById("react")
);

＆＃13;

.container {
  width: 100%;
  height: 100%;
}

＆＃13;

<div id="react"></div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

＆＃13;

onMouseMove不会在元素之外工作

1 个答案: