我有一个字符串，需要txt在单击按钮时将其下载到文件中。这如何使用 React 来实现？
在 React 中将字符串下载为 .txt 文件
IT技术
javascript
file
reactjs
mime-types
2021-04-12 00:51:02
1个回答
这是一个工作示例。在输入字段中输入文本并单击Download txt，这将下载txt您在输入中输入的内容。
此解决方案创建一个MIME 类型的新Blob 对象，text并将其附加到href临时锚点 ( <a>) 元素的 ，然后以编程方式触发该元素。
Blob 对象表示不可变的原始数据的类文件对象。Blob 表示不一定采用 JavaScript 原生格式的数据。
class MyApp extends React.Component {
downloadTxtFile = () => {
const element = document.createElement("a");
const file = new Blob([document.getElementById('myInput').value], {type: 'text/plain'});
element.href = URL.createObjectURL(file);
element.download = "myFile.txt";
document.body.appendChild(element); // Required for this to work in FireFox
element.click();
}
render() {
return (
<div>
<input id="myInput" />
<button onClick={this.downloadTxtFile}>Download txt</button>
</div>
);
}
}
ReactDOM.render(<MyApp />, document.getElementById("myApp"));<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<div id="myApp"></div>