菜鸟教程小白 发表于 2022-12-11 18:32:57

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


                                            <p><p>我无法让我的 React 应用程序在移动 Safari 上以最佳方式运行。我的应用程序通常会在桌面上放置、发布、修补和删除,但在我的 iPhone 上不会这样做。我尝试在下面的 React 组件中添加“cursor:pointer”和 onTouchStart,但似乎没有任何效果。 </p>

<pre><code> onSubmit(event) {
    const name = this.state.name;
    const instructor = cookies.get(&#39;instructor&#39;)._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 (
    &lt;div className=&#34;container&#34;&gt;
      &lt;div className=&#34;field-line&#34;&gt;
          &lt;label htmlFor=&#34;coursename&#34;&gt;New Course Name:&lt;/label&gt;
          &lt;input
            id=&#34;coursename&#34;
            name=&#34;coursename&#34;
            value={this.state.name}
            onChange={this.updateName}
          /&gt;
      &lt;/div&gt;
    &lt;/div&gt;
    &lt;div className=&#34;edit-course-buttons&#34;&gt;
      &lt;button
      className=&#34;edit-course&#34;
      onClick={this.onSubmit}
      onTouchStart={this.onSubmit}&gt;
      Edit Course
      &lt;/button&gt;
    &lt;/div&gt;
&lt;/div&gt;
);
</code></pre>

<p>}
}</p></p>
                                    <br><hr><h1><strong>Best Answer-推荐答案</ strong></h1><br>
                                            <p><p>我在 iOS 设备上也遇到了同样的问题。能够通过将 onClick 替换为触摸事件来克服这些问题。查看有关 ReactJS 中触摸事件的文档。您可以使用 onTouchStart 代替 onClick 看看它是否有效!所以你的按钮应该是这样的:</p>

<pre><code>&lt;button onTouchStart=&#34;{this.onSubmit}&#34; onclick = &#34;void(0)&#34; ...&gt;
&lt;/button&gt;
</code></pre>

<p>我已按照接受的答案 <a href="https://stackoverflow.com/a/35047416/5346095" rel="noreferrer noopener nofollow">here</a> 中的建议添加了 <code>onClick</code> .</p>

<p> <a href="https://facebook.github.io/react/docs/events.html#touch-events" rel="noreferrer noopener nofollow">https://facebook.github.io/react/docs/events.html#touch-events</a> </p>

<p>检查类似的问题,根据 <a href="https://stackoverflow.com/a/16006333/5346095" rel="noreferrer noopener nofollow">answer</a>投票最多的您需要使用 touchevent 并将 <code>cursor:pointer;</code> css 添加到与 click 事件关联的元素中。</p></p>
                                   
                                                <p style="font-size: 20px;">关于ios - 点击事件不会在点击 iOS 设备时触发,但在桌面上按预期工作,我们在Stack Overflow上找到一个类似的问题:
                                                        <a href="https://stackoverflow.com/questions/45829772/" rel="noreferrer noopener nofollow" style="color: red;">
                                                                https://stackoverflow.com/questions/45829772/
                                                        </a>
                                                </p>
                                       
页: [1]
查看完整版本: ios - 点击事件不会在点击 iOS 设备时触发,但在桌面上按预期工作