Skip to main content

Opening and downloading files

The widget provides special actions for opening and downloading files:

You need to listen to these actions using the api.on() method and call the required functions for these actions.

Example:

<script>
import { Filemanager } from "wx-svelte-filemanager";

const server = "https://some-backend-url";

function getLink(id, download) {
return server + "/direct?id=" + encodeURIComponent(id) + (download ? "&download=true" : "");
}

function loadData(id, api) {
fetch(server + "/files/" + encodeURIComponent(id))
.then((data) => data.json())
.then((data) => {
api.exec("provide-data", {
id,
data,
});
});
}

let rawData = $state([]);
fetch(server + "/files")
.then((data) => data.json())
.then((data) => (rawData = data));

const init = (api) => {
api.on("download-file", (ev) => {
window.open(getLink(ev.id, true), "_self");
});

api.on("open-file", (ev) => {
window.open(getLink(ev.id), "_blank");
});

api.on("request-data", ({ id }) => loadData(id, api));
}

</script>

<Filemanager {init} data={rawData} />

About loading data see here: Loading data


Related samples: Backend data