2
Я пытаюсь вызвать класс при касании. С onClick он отлично работает на рабочем столе, но с onTap/onTouchStart/onTouchEnd событие не запускается. Я запускаю React.initializeTouchEvents(true) перед визуализацией компонентов. Обработчик кликов находится на элементе div, и я установил cursor: pointer. Я использую lonovo yoga 2 pro и iPad для тестирования. Кроме того, я использую react router. У кого-нибудь есть идея, почему он не работает?Reactjs touchhevents не работает
Init:
React.initializeTouchEvents(true)
Router.run(routes, Router.HistoryLocation, function (Handler) {
React.render(<Handler data={dummyData} />, document.getElementById('app'));
});
Компонент:
var Transaction = React.createClass({
getInitialState: function(){
return ({showDetails: false})
},
toggleDetails: function(e){
e.preventDefault()
this.setState({showDetails: !this.state.showDetails})
},
render: function(){
var itemClasses = "pl-transaction-item pl-transaction-status-"+this.props.data.status
return (
<li className={this.state.showDetails ? itemClasses + " pl-active" : itemClasses} >
// here is the touch event listener
<div className="pl-transaction-item-header" onTap={this.toggleDetails} onTouchEnd={this.toggleDetails}>
<img src={this.props.data.img} alt="" /><span>name: {this.props.data.name}</span><span>status: {this.props.data.status}</span><span>date: {this.props.data.date}</span>
</div>
<div className="pl-transaction-item-details">
<img src={this.props.data.img} alt="" />
<ul>
<li>name: {this.props.data.name}</li>
<li>status: {this.props.data.status}</li>
<li>date: {this.props.data.date}</li>
<li><button>OK</button></li>
</ul>
</div>
</li>
)
}
})