React.js Ben mousemove olay azaltmasını gerek event.persist() hatası

Question

atma tutmak mousemove olayı kısma ve ben yöntemi oluşturmak için aşağıdaki ipuçlarını uygulayın, ancak çalışmıyor: İşte Perform debounce in React.js

benim kodu (http://jsbin.com/binesofepo/edit?js,console,output):

Uyarı: Eğer tool__body üzerine MouseMove tutarsanız

class Tool extends Component { 
    constructor(props) { 
    super(props); 
    this._onMouseMove = _.throttle(this._onMouseMove.bind(this), 1000) 
    } 

    render() {  
    return (

     <div ref="tool" className="tool"> 
     <div ref="toolBody" 
      className="tool__body" 
      onMouseMove={this._onMouseMove}></div> 
     </div> 
    ) 
    } 
    _onMouseMove(e) { 
    e.persist() 
    console.log(e.screenX) 
    } 
} 

, aşağıda uyarı çok alırsınız Bu s sentetik neden performans nedenleriyle yeniden kullanılır. Bunu görüyorsanız, yayınlanmış/geçersiz bir sentetik etkinliğe screenX mülküne erişiyorsunuz. Bu boş olarak ayarlandı. Orijinal sentetik etkinliği saklamak zorundaysanız, event.persist() öğesini kullanın. Daha fazla bilgi için bkz. Fb.me/react-event-pooling.

versiyonunu tepki Gözat: "15.0.2"

iyi çalışmıyor e.persist() görünüyor. Herhangi bir fikir? : D

Answer 1

e.persist olay ile eşzamanlı olarak çağrılmalıdır, işleyici eşzamansız olarak çağrılabilir. İşte düzeltmedir:

class Tool extends React.Component { 
    constructor(props) { 
    super(props); 
    this._throttledMouseMove = _.throttle(this._throttledMouseMove.bind(this), 2000); 
    } 

    _throttledMouseMove = (e) => { 
    console.log(e.screenX); 
    } 

    render() {  
    return (
     <div ref="tool" className="tool"> 
     <div ref="toolBody" 
      className="tool__body" 
      onMouseMove={this._onMouseMove}> 
     </div> 
     </div> 
    ) 
    } 

    _onMouseMove = (e) => { 
    e.persist(); 
    this._throttledMouseMove(e); 

    } 
} 
ReactDOM.render(<Tool/>, document.querySelector('.main')) 

ilgili değişiklik olaydan doğrudan _onMouseMove çağırarak ve aslında kısıtlanmış oluyor olayı işlemek için ikinci bir yöntem oluşturmaktadır.