鍍金池/ 問答/HTML/ react使用post從服務(wù)器下載文件,發(fā)現(xiàn)360瀏覽器有問題

react使用post從服務(wù)器下載文件,發(fā)現(xiàn)360瀏覽器有問題

react中實現(xiàn)從服務(wù)器下載文件

百度找了個大牛寫的便用在項目上,用谷歌,IE測試可以正常下載文件,用360瀏覽器會出現(xiàn)問題,頁面切換會神奇的進入點擊事件downloadDetailData這個方法回調(diào)里面,也就是會再次觸發(fā)下載文件,其它瀏覽器不會,就360瀏覽器會出現(xiàn)這個問題,求解決,或者大家有在項目中使用過別的方法的話可以分享下么

//內(nèi)容來源 https://blog.csdn.net/jiangkai528/article/details/78852777

downloadDetailData=()=>{
    var divElement= document.getElementById("downloadDiv");
    var downloadUrl=`${apiBasePath}/api/xxxxx/downloadDetailData`;
    var params=JSON.stringify({
         key:'value'
    })
    ReactDOM.render(
          <form action={downloadUrl} method="post">
            <input name="params" type="text" value={params}/> 
          </form>,
          divElement
      )
    ReactDOM.findDOMNode(divElement).querySelector('form').submit();
    ReactDOM.unmountComponentAtNode(divElement);
}
render() {
  <div>
    <div id='downloadDiv' style={{display:'none'}}> </div>
    <Button type="primary" onClick={this.downloadDetailData}>導(dǎo)出</Button>
  </div>
}
回答
編輯回答
熊出沒

下載個文件,哪有那么麻煩。
這個下載文件是我們用的,沒出什么問題:
download

2017年8月23日 12:17
編輯回答
護她命

文件下載可以使用這個 https://github.com/azl3979858...

2017年11月28日 09:14
編輯回答
夏木

網(wǎng)上找了另外一個版本,發(fā)現(xiàn)用在項目上可行,其它瀏覽器測了暫時沒發(fā)現(xiàn)有啥問題

let formElement = document.createElement('form');
formElement.style.display = "display:none;";
formElement.method = 'post';
formElement.action = ${apiBasePath}/api/xxxxx/downloadDetailData;
formElement.target = 'callBackTarget';
let inputElement = document.createElement('input');
inputElement.type = 'hidden';
inputElement.name = "params" ;
inputElement.value = params;
formElement.appendChild(inputElement);
document.body.appendChild(formElement);
formElement.submit();
document.body.removeChild(formElement);

2017年1月30日 11:24