禁用 dropzone 頁面刷新

Question

我已經搜索了幾天，並找到了多種解決方案，如何在上傳后重新加載頁面等等。 我的問題是上傳后頁面會自動重新加載，我不想要這個。

我不確定我在這里缺少什么，但這是 dropzone 主頁上的一個非常標准的設置。

function initDropzone() {


    var dz = new Dropzone('#fupld', {
        url: 'upload',
        autoProcessQueue: true,
        paramName: 'files',
        autoDiscover:false,
        init: function () {
            this.on('queuecomplete', () => {
            }),
                this.on('success', function (file, response) {
            });
            this.on('error', (file, response) => {
                console.log(response);
            });
        }
    });
}


<form class="fupld" action="@Url.Action("upload")" id="fupld" method="post">
    <div class="dz-message">Upload</div>
    <div class="fallback">
        <input name="file" type="file" multiple />
    </div>
</form>

一切都按預期完成。 上傳文件，顯示錯誤等。

我試圖解決的唯一問題是成功上傳后頁面刷新，我不想要這個。

我的服務器端總是返回 Json，並且在任何地方都沒有重定向。

我試圖掛鈎提交事件並調用 preventDefault 並在成功上傳后調用 dropzone disable() 但頁面仍然刷新。

任何建議，將不勝感激。

請注意，這是使用 .NET 上傳。

Answer 1

我參加這個派對太晚了……但對我來說，我面臨着同樣的問題。 發布后我的頁面正在刷新......問題原來是我用來開始上傳的按鈕沒有 type="button" 所以最終 dropzone 帖子正在運行，以及按鈕正常運行提交表格！

僅當您使用自己的表單作為放置區時才會發生這種情況（以便您也可以發布其他輸入）。

Answer 2

我希望這對可能面臨同樣問題的人有所幫助。

在對 javascript 添加/刪除修改事件處理程序和其他函數進行不斷更改后，問題是在 Visual Studio 中打開了 BrowserLink。 一旦我關閉 BrowserLink 似乎一切正常，所以看起來 browserlink 在 200 響應后重新加載頁面。

Answer 3

您是否嘗試停止對事件的傳播？ 連同 preventDefault https://developer.mozilla.org/en-US/docs/Web/API/Event/stopPropagation

Answer 4

做這個：

const {getRootProps} = useDropzone({noDragEventsBubbling: true});

更多信息在這里