如何让IE 11不支持ReactJS中的FormData。 FormData.get()不受支持

时间:2016-06-15 20:04:18

标签: html reactjs internet-explorer internet-explorer-11

代码在FFChrome上正常运行,但不会在IE上运行。

我读到我需要在index.html中添加另一个元标记,但这并没有解决问题。 IE不支持FormData吗?我可以更新状态直接在dropHandler方法中存储名称,但想知道为什么FormData不适用于IE。

    <meta http-equiv="X-UA-Compatible" content="IE=edge" />

错误:

SCRIPT438: Object doesn't support property or method 'get'

导致错误的代码:

this.state.jsonFile.get('name')

反应组件:

'use strict';

const React = require('react');
const ReactDOM = require('react-dom');


class TestCaseDialog extends React.Component {

  constructor(props) {
    super(props);
    this.state = {jsonFile: null, loadingPage: false, loadingMessage: '', errorAlertVisible: false, errorAlertMessage: '', filePath: null};
    this.dropHandler = this.dropHandler.bind(this);
  }


  dropHandler(file) {

    var jsonFile = new FormData();
    jsonFile.append('file', file[0]);
    jsonFile.append('name', file[0].name);

    ..... 

    this.setState({jsonFile: jsonFile,
                       filePath: resp.text});

  }

  render() {

   ...
       dropZone.push = <div key='file-details'>File has been uploaded: {this.state.jsonFile.get('name')}</div>;
   ...

    return (
      <div>
         {this.state.loadingPage ? <LoadingPage key='loadingPage' loadingMessage={this.state.loadingMessage} /> : (
           <div key="dz">
             {dropZone}
           </div>
         )}
         {errorAlert}
       </div>
     );
  }
}

module.exports = TestCaseDialog

的index.html

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head lang="en">
    <meta charset="UTF-8"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <!-- cerulean style -->
    <!--link rel="stylesheet" href="https://bootswatch.com/cerulean/bootstrap.css" /-->
    <!--link rel="stylesheet" href="https://bootswatch.com/cerulean/bootstrap-theme.min.css" /-->
    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css" />
    <!-- Optional theme -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap-theme.min.css" />
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.2/css/font-awesome.min.css" />
    <link rel="stylesheet" href="/main.css" />
</head>
<body>

    <!--div>
      <Logged in as: <span th:text="${#authentication.name}">user</span>.
      <form th:action="@{/logout}" method="post">
          <input type="submit" value="Log Out"/>
      </form>
    </div-->
    <div id="react"></div>

    <script src="built/bundle.js"></script>

</body>
</html>

0 个答案:

没有答案