当前位置 : 主页 > 网页制作 > React >

reactjs – 在React中创建的选择控件在浏览器刷新时不会重置(IE11和Edge)

来源:互联网 收集:自由互联 发布时间:2021-06-15
我有一个非常简单的React应用程序,只有一个选择控件.请参阅工作应用程序 here.选择控件有3个值:星期日,星期一和星期二.星期日是默认值.不幸的是,在IE11和Microsoft Edge上,即使浏览器刷新
我有一个非常简单的React应用程序,只有一个选择控件.请参阅工作应用程序 here.选择控件有3个值:星期日,星期一和星期二.星期日是默认值.不幸的是,在IE11和Microsoft Edge上,即使浏览器刷新后,选择控件也会卡在所选值上!例如,选择星期二,然后刷新浏览器 – 选择框不会返回星期日,它会在星期二卡住!在Chrome和Safari上,我没有看到这个问题. (注意:您必须在各种浏览器上下载并运行该应用程序.)

主要组件的代码如下所示.知道为什么IE和Edge行为不端吗?

import React from 'react';

class HelloWorld extends React.Component {

  constructor() {
    super();
    this.state = {
      selectedOption: 'sun'
    }
  }

  render() {
    let options = [
      { value: 'sun', label: 'Sunday'  },
      { value: 'mon', label: 'Monday'  },
      { value: 'tue', label: 'Tuesday' }
    ];

    return (
      <select
        className="form-control"
        value={this.state.selectedOption}
        onChange={ e => this.setState({selectedOption: e.target.value}) }>
        {
          options.map(option => {
            return <option value={option.value} key={option.value}>{option.label}</option>;
          })
        }
      </select>
    );
  }

}

export default HelloWorld;
Naresh,你的代码很好.

Internet Explorer和Edge行为不正常,因为它们正在缓存select标记.在Windows上,按Ctrl F5快捷键进行硬刷新.在Mac上,按住⌘Cmd和⇧Shift键,然后按R.

网友评论