我有以下代码，让用户下载数据字符串在csv文件。
exportData = 'data:text/csv;charset=utf-8,';
exportData += 'some csv strings';
encodedUri = encodeURI(exportData);
newWindow = window.open(encodedUri);
它工作得很好，如果客户端运行代码，它会生成空白页，并开始下载csv文件中的数据。
我试着用JSON对象来做这个
exportData = 'data:text/json;charset=utf-8,';
exportData += escape(JSON.stringify(jsonObject));
encodedUri = encodeURI(exportData);
newWindow = window.open(encodedUri);
但是我只看到一个页面，上面显示了JSON数据，没有下载它。
我进行了一些研究，这一个声称工作，但我没有看到我的代码有任何不同。
我在代码中遗漏了什么吗?
谢谢你阅读我的问题。
当前回答
const exportToJson = (data: {}) =>{ const link = document.createElement("a"); 链接。href = 数据:text / json; charset = utf8, $ {encodeURIComponent (JSON.stringify(数据)};链接。下载= 'example.json';link.click ();}
如果你不想要一个什么都不做的随机元素，请确保在创建链接后清理干净。
其他回答
const exportToJson = (data: {}) =>{ const link = document.createElement("a"); 链接。href = 数据:text / json; charset = utf8, $ {encodeURIComponent (JSON.stringify(数据)};链接。下载= 'example.json';link.click ();}
如果你不想要一个什么都不做的随机元素，请确保在创建链接后清理干净。
React:在你的渲染方法中添加这个。
•状态中的对象:
<a
className="pull-right btn btn-primary"
style={{ margin: 10 }}
href={`data:text/json;charset=utf-8,${encodeURIComponent(
JSON.stringify(this.state.objectToDownload)
)}`}
download="data.json"
>
DOWNLOAD DATA AS JSON
</a>
•道具中的物体:
<a
className="pull-right btn btn-primary"
style={{ margin: 10 }}
href={`data:text/json;charset=utf-8,${encodeURIComponent(
JSON.stringify(this.props.objectToDownload)
)}`}
download="data.json"
>
DOWNLOAD DATA AS JSON
</a>
className和style是可选的，根据需要修改样式。
链接的下载属性是新的，在Internet Explorer中是不支持的(见这里的兼容性表)。对于这个问题的跨浏览器解决方案，我想看看FileSaver.js
这将是一个纯JS版本(改编自牛仔):
var obj = {a: 123, b: "4 5 6"};
var data = "text/json;charset=utf-8," + encodeURIComponent(JSON.stringify(obj));
var a = document.createElement('a');
a.href = 'data:' + data;
a.download = 'data.json';
a.innerHTML = 'download JSON';
var container = document.getElementById('container');
container.appendChild(a);
http://jsfiddle.net/sz76c083/1
2021年的ES6+版本;也没有1MB限制:
这是从@maia的版本改编而来的，针对现代Javascript进行了更新，将废弃的initMouseEvent替换为新的MouseEvent()，代码总体上得到了改进:
const saveTemplateAsFile = (filename, dataObjToWrite) => {
const blob = new Blob([JSON.stringify(dataObjToWrite)], { type: "text/json" });
const link = document.createElement("a");
link.download = filename;
link.href = window.URL.createObjectURL(blob);
link.dataset.downloadurl = ["text/json", link.download, link.href].join(":");
const evt = new MouseEvent("click", {
view: window,
bubbles: true,
cancelable: true,
});
link.dispatchEvent(evt);
link.remove()
};
如果你想传递一个对象:
saveTemplateAsFile("filename.json", myDataObj);
