我正在使用Laravel 5.5。我一直试图让Dropzone使用来自语言文件的自定义消息。我已根据此论坛中的帖子尝试了一些组合，但我无法让它发挥作用。
使用webpack我导入Dropzone，如下所示：
window.Dropzone = require('dropzone');
无论我的代码是否存在，模式都会以Dropzone形式显示，因此忽略了我的选项。
我错过了什么？
我有FIDDLE here。
使用webpack我导入Dropzone，如下所示：
window.Dropzone = require('dropzone');
这是我的Dropzone代码：
var removeButton = '<button id="dz-remove-file-button" class="btn btn-danger">{{ trans("messages.remove") }}</button>';
Dropzone.autoDiscover = true;
$('#showPopUpUpload').on('show.bs.modal', function () {
$mh.animateModal('showPopUpUploadDialog', 'open');
}).on('hide.bs.modal', function () {
$mh.animateModal('showPopUpUploadDialog', 'close');
Dropzone.forElement("#dropzone-form").removeAllFiles(true);
});
$('.show_upload').click(function () {
$('#showPopUpUpload').modal('show');
});
// Dropzone for file uploads
Dropzone.options.dropzoneForm = {
dictDefaultMessage: "{{ trans('messages.dict_default_message') }}",
dictFallbackMessage: "{{ trans('messages.dict_fallback_message') }}",
dictFallbackText: "{{ trans('messages.dict_fallback_text') }}",
dictFileTooBig: "{{ trans('messages.dict_file_too_big') }}",
dictInvalidFileType: "{{ trans('messages.dict_invalid_file_type') }}",
dictResponseError: "{{ trans('messages.dict_response_error') }}",
dictCancelUpload: "{{ trans('messages.dict_cancel_upload') }}",
dictUploadCanceled: "{{ trans('messages.dict_upload_canceled') }}",
dictCancelUploadConfirmation: "{{ trans('messages.dict_cancel_upload_confirmation') }}",
dictRemoveFile: "{{ trans('messages.dict_remove_file') }}",
dictRemoveFileConfirmation: "{{ trans('messages.dict_remove_file_confirmation') }}",
dictMaxFilesExceeded: "{{ trans('messages.dict_max_files_exceeded') }}",
init: function () {
this.on('addedfile', function (file) {
$('.dz-default').empty();
$('.dz-default').text("{{ trans('messages.file_importing') }}");
});
this.on('success', function (file, responseText) {
if (responseText.type === 'error') {
var message = "{{ trans('messages.file_import_error') }}<br/>";
$.each(responseText, function (index, value) {
if ($.isArray(value)) {
$.each(value, function (index, valueMsg) {
if (valueMsg !== 'error') {
message = message + '<br/>' + valueMsg;
}
});
} else {
if (value !== 'error') {
message = message + value;
}
}
});
$('.dz-success-mark').hide();
$('.dz-error-mark').show();
$('.dz-error-message').html(message).show();
var removeButton = Dropzone.createElement(removeButton);
var _this = this;
removeButton.addEventListener("click", function (e) {
e.preventDefault();
e.stopPropagation();
_this.removeFile(file);
$('.dz-success-mark').hide();
$('.dz-error-mark').hide();
$('.dz-error-message').text('').hide();
$('.dz-default').text(Dropzone.prototype.defaultOptions.dictDefaultMessage);
});
file.previewElement.appendChild(removeButton);
} else {
this.removeAllFiles(true);
$('#upload_file').modal('hide');
if (redirectSuccessRoute) {
window.location.href = redirectSuccessRoute;
}
}
});
this.on("error", function (file, responseText) {
var removeButton = Dropzone.createElement(removeButton);
var _this = this;
removeButton.addEventListener("click", function (e) {
e.preventDefault();
e.stopPropagation();
_this.removeFile(file);
$('.dz-success-mark').hide();
$('.dz-error-mark').hide();
$('.dz-error-message').text('').hide();
$('.dz-default').text(Dropzone.prototype.defaultOptions.dictDefaultMessage);
});
file.previewElement.appendChild(removeButton);
var message = '';
$('.dz-error-message').empty();
if ($.isArray(responseText)) {
$.each(responseText, function (index, value) {
if ($.isArray(value)) {
$.each(value, function (index, valueMsg) {
message = message + '<br/>' + valueMsg;
});
} else {
message = value;
}
});
$('.dz-error-message').html(message);
} else {
$('.dz-error-message').html(responseText);
}
});
},
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
},
previewTemplate: '<div class="dz-preview dz-file-preview">' +
'<div class="dz-details">' +
'<div class="dz-filename">' +
'<span data-dz-name></span>' +
'</div>' +
'<div class="dz-size" data-dz-size></div>' +
'<img data-dz-thumbnail />' +
'</div>' +
'<div class="dz-progress-container">' +
'<div class="dz-progress">' +
'<span class="dz-upload" data-dz-uploadprogress></span>' +
'</div>' +
'</div>' +
'<div class="dz-success-mark">' +
'<span><i class="fas fa-check-circle"></i></span>' +
'</div>' +
'<div class="dz-error-mark">' +
'<span><i class="fas fa-times-circle"></i></span>' +
'</div>' +
'<div class="dz-error-message">' +
'<span data-dz-errormessage></span>' +
'</div>' +
'</div>',
paramName: "file",
acceptedFiles: '.csv',
maxFilesize: 5.00, // 5MB file size max for logo
maxFiles: 1,
autoProcessQueue: true
};
答案 0 :(得分：0)
我只需要在Dropzone.options来电之外进行$(document).ready()来电。