Sự kiện tổng hợp phản hồi phân biệt các sự kiện nhấp chuột trái và phải

Question

Tôi đang cố gắng phân biệt giữa các nhấp chuột trái và phải trong một chức năng OnClick. Nhưng,

var r = React.createClass({ 
    handleClick : function(e){ 
     //left click 
     if(e.which==1){ 
      //Do something 
     } 
    }, 
    render : function(){ 
     return <p onClick={this.handleClick}>Something </p> 
    } 
}); 

Tắt e.which không được xác định cho Sự kiện tổng hợp. Làm cách nào tôi có thể phân biệt giữa các nhấp chuột trái và phải ở đây?

Answer 1

Bạn có thể làm một cái gì đó như thế này quá. Có cả onClick và onContextMenu xử lý

return <p onClick={this.handleClick} onContextMenu={this.handleClick}>Something </p> 

Bạn có thể kiểm tra nativeEvent là câu trả lời khác gợi ý hoặc kiểm tra type. (Ngoài ra, ngăn chặn mặc định nếu nó là một click chuột phải.)

Sử dụng type

handleClick: function(e) { 
    if (e.type === 'click') { 
    console.log('Left click'); 
    } else if (e.type === 'contextmenu') { 
    console.log('Right click'); 
    } 
} 

Sử dụng nativeEvent

handleClick: function(e) { 
    if (e.nativeEvent.which === 1) { 
    console.log('Left click'); 
    } else if (e.nativeEvent.which === 3) { 
    console.log('Right click'); 
    } 
} 

Dưới đây là một bản demo http://jsbin.com/seyeliv/edit?html,output

Answer 2

Sử dụng:

if (e.button === 0) { // or e.nativeEvent.which === 1 
    // do something on left click 
} 

Here is a DEMO

Answer 3

Thuộc tính bạn' đang tìm kiếm là e.button hoặc e.buttons.

Số nút được nhấn khi sự kiện chuột được kích hoạt: Nút trái = 0, nút giữa = 1 (nếu có), nút phải = 2.
_{- MDN:Web/Events/click}

Tuy nhiên, có hoặc không có phản ứng, tôi chỉ nhận được sự kiện nhấp chuột với nút chuột trái (trackpad). Bạn có thể sử dụng onMouseDown mà làm việc cho tôi.

Đây là một demo sử dụng e.buttons. Bạn có thể muốn ngăn chặnDefault trong onContextMenu cũng.