Evénement tactile synthétique dans React

Question

Avec le .js suivant, le redimensionnement de la zone de texte dans le navigateur ne présente aucun type d'événement tactile, bien que les autres événements fonctionnent comme prévu.

class App extends React.Component{ 
    constructor(){ 
     super(); 
     this.state = {currentEvent: "---"}; 
     this.update = this.update.bind(this) 
    } 

    update(e){ 
     this.setState({currentEvent: e.type}) 
    } 


    render(){ 
     return (
      <div> 
       <textarea cols='30' rows='10' 
        onKeyPress={this.update} 
        onCopy={this.update} 
        onDoubleClick={this.update} 
        onTouchStart={this.update} 
        onTouchMove={this.update} 
        onTouchEnd={this.update} 
        /> 
       <h1>{this.state.currentEvent}</h1> 
      </div> 
     ) 
    } 
} 

export default App 

Answer 1

Fondamentalement, aucun navigateur déclenchera un événement resize pour textarea. Au lieu de cela, vous devez écouter les événements mouseup ou touchend qui se produisent après que l'utilisateur a redimensionné. Mais puisque ces événements peuvent également être déclenchés en cliquant simplement sur le textarea, vous pouvez comparer la nouvelle taille de l'élément à l'ancienne taille pour déterminer si elle a réellement été redimensionnée ou non.