单击iOS设备时不会触发Click事件,但在桌面上按预期工作

时间:2017-08-23 02:39:13

标签: ios reactjs mern

我无法让我的React应用程序在移动Safari上以最佳方式运行。我的应用程序通常会在桌面上进行PUT,POST,PATCH和DELETE,但不会在我的iPhone上进行。我已经尝试将“cursor:pointer”和onTouchStart添加到我的React组件中,但似乎没有什么可以做的。

 onSubmit(event) {
    const name = this.state.name;
    const instructor = cookies.get('instructor')._id;
    this.setState({
       submitted: true,
     });
    this.props.dispatch(actions.editCourse(name,this.props.match.params.cuid));
   }



  render() {
    if (this.state.submitted) {
       window.location.href = `https://young-mountain-65748.herokuapp.com /courses/${this.props.match.params.cuid}`;
    }
return (
    <div className="container">
        <div className="field-line">
          <label htmlFor="coursename">New Course Name:</label>
          <input
            id="coursename"
            name="coursename"
            value={this.state.name}
            onChange={this.updateName}
          />
        </div>
    </div>
    <div className="edit-course-buttons">
      <button
        className="edit-course"
        onClick={this.onSubmit}
        onTouchStart={this.onSubmit}>
        Edit Course
      </button>
    </div>
  </div>
);

} }

1 个答案:

答案 0 :(得分:0)

我在iOS设备上也有同样的问题。能够通过用触摸事件替换onClick来克服这些问题。请查看ReactJS中触摸事件的此文档。您可以使用onTouchStart而不是onClick,看看它是否有效!所以你的按钮应该是这样的:

<button onTouchStart="{this.onSubmit}" onclick = "void(0)" ...>
</button>

我已在接受的答案here中添加了onClick

https://facebook.github.io/react/docs/events.html#touch-events

检查类似的问题,根据answer投票最多,你需要使用touchevent并添加cursor: pointer; css,以便你有与之关联的点击事件。