小编And*_*ann的帖子

我的 React Web 应用程序强制将焦点集中到表单中的第一个输入字段，即使我主动用鼠标更改它（不过我可以通过 Tab 键切换输入字段）。

所以我尝试调试只是为了找出问题发生的原因或位置。但我相信这可能与 HTML 以及我不知道的输入字段的工作方式有关，或者可能与某些浏览器特定的功能有关，因为这仅发生在 Safari 而不是 Chrome 中。

React 应用程序使用以下代码创建输入字段列表。Skills是一个数组，默认情况下其中包含三个空字符串，例如["", "", ""].

该Keyword组件的呈现方式如以下代码片段所示。

{Skills.map((i, index) => {
   return (
      <Keyword
         key={index}
         value={i}
         type="text"
         className={css(inheritedStyles.formInput)}
         changed={e => onListChange(e, 'Skills', index)}
         clicked={e => onListRemove(e, index, 'Skills')}
       />
   );
})}

  render() {
    const { changed, clicked, value } = this.props;
    return (
      <div>
        <input value={value} className={css(styles.formInput)} type="text" onChange={changed} />
        <a href="#remove-skill-field" onClick={clicked}>
          <svg className={css(styles.removeKeyword)} viewBox="0 0 96 96">
            <path
              fill={this.props.color}
              fillRule="evenodd"
              d="M48,44.8180195 …