时间戳

首页 > 解决方案 > 是否有在 vue-dropzone 消息区域中加载自定义 HTML 元素的有效解决方案？

vue.js - 是否有在 vue-dropzone 消息区域中加载自定义 HTML 元素的有效解决方案？

问题描述

我一直在使用 vue-js 和 vue-dropzone 处理我的代码，以处理拖放上传到站点的功能。我在父 html-tag 中添加了“:useCustomSlot=true”，但我放置在 dropzone 标记中的内容没有呈现在 DOM 上！你能理解问题是什么。

该页面仍在呈现来自 vue-dropzone 的默认消息。

以下是代码：

    <vue-dropzone   id="customdropzone"  
                ref="myVueDropzone"
                :options="dropzoneOptions"
                :useCustomSlot=true>
  <div class="dropzone-custom-content">
    <h3 class="dropzone-custom-title">Drag and drop to upload content!</h3>
    <div class="subtitle">...or click to select a file from your computer</div>
  </div>
</vue-dropzone>

和 Vue 实例：

var App = new Vue({
    el:'#app',
    data: {
        ...,
        dropzoneOptions: {
            url: './upload.php',
            addRemoveLinks: true,
            thumbnailWidth: 150,
            maxFilesize: 3, // MB
            maxFiles:1,
            acceptedFiles: '.png,.jpg,.mp4',
            headers: { "My-Awesome-Header": "header value" },
        }
    },
    components: {
            vueDropzone: vue2Dropzone
    }
});

标签： vue.jsdrag-and-dropdropzone.jsvue-dropzone

解决方案

尝试:use-custom-slot="true"（烤肉串）

推荐阅读