Question

我正在尝试使用此vue.js上传图片。我正在使用此plugin完成任务。但是我需要更改语言。在文档中，据说我们可以使用道具来更改它。我做到了，

:drag-text='drag_text'

这是我完整的代码。

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>vue-upload-multiple-image</title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <div>
            <div id="car_ad_others"></div>
        </div>


        <script src="http://code.jquery.com/jquery-latest.min.js"></script>
        <script src="https://cdn.jsdelivr.net/npm/vue@2.5.22/dist/vue.js"></script>


        <script type="text/javascript">
             var parent = $('#car_ad_others').parent();
             parent.html('<div id="car-image-upload"><upload-component></upload-component></div>');
             $('#car_ad_others').parent().attr('id', 'car_ad_parent');

             Vue.component('upload-component', {
                 props: ['dragText'],
                 data: function () {
                     return {
                         images: '',
                         uploadImageSuccess: '',
                         beforeRemove: '',
                         editImage: '',
                         dataChange: '',
                         drag_text: 'ddd'
                     };
                 },
                 template: "<div id='my-strictly-unique-vue-upload-multiple-image' style='display: flex; justify-content: center;'><vue-upload-multiple-image :drag-text='drag_text' @upload-success='uploadImageSuccess' @before-remove='beforeRemove' @edit-image='editImage' @data-change='dataChange' :data-images='images'></vue-upload-multiple-image></div>"
             });
             new Vue({el: '#car-image-upload'});
    </script>
    <script src="https://unpkg.com/vue-upload-multiple-image@1.0.2/dist/vue-upload-multiple-image.js"></script>
    </body>
</html>

很不幸，它没有翻译，我也收到了这个错误，

[Vue警告]：未知的自定义元素：-做过您是否正确注册了组件？对于递归组件，请确保提供“名称”选项。

属性在此link中。并且我简化了代码以更轻松地显示此问题。所以我不能改变结构。

Answer 1

看来，库本身有一个错误。该文档中的Codepen似乎不响应道具更改。关于您的[Vue warn]: Unknown custom element:警告，某种程度上它对我有用：

    components: {
       'vue-upload-multiple-image': () => import('https://unpkg.com/vue-upload-multiple-image@1.0.2/dist/vue-upload-multiple-image.js')
    },

并评论<script src="https://unpkg.com/vue-upload-multiple-image@1.0.2/dist/vue-upload-multiple-image.js"></script>

我仍在尝试找出方法，但这应该与本地注册组件与组件的全局注册有关。我会在给出更好而具体的解释的同时改善此答案

更改Vue img上传器的属性

1 个答案: