代码之家  ›  专栏  ›  技术社区  ›  vimuth

[vue warn]:upload success事件处理程序出错:“typeerror:fns.apply不是函数”

  •  0
  • vimuth  · 技术社区  · 6 年前

    我在用这个 plugin 上传图像。但我有这个错误

    [Vue warn]:事件处理程序中的“上载成功”错误:“类型错误: fns.apply不是在---中找到的函数 节点_modules/vue上载多个图像/src/components/vue upload multiple image.vue 在 资产/frontend/js/components/vueuploadmultipleimages.vue

    这是我的密码,

    <template>
        <div class="vue-upload-multiple-image" style='display: flex; justify-content: left;'>
            <vue-upload-multiple-image
                    @upload-success='uploadImageSuccess'
                    @before-remove='beforeRemove'
                    @edit-image='editImage'
                    @data-change='data_change'
                    :dragText="dragText"
                    :browseText="browseText"
                    :dropText="dropText"
                    :markIsPrimaryText="markIsPrimaryText"
                    :popupText="popupText"
                    :primaryText="primaryText"
                    :data-images='images'>
            </vue-upload-multiple-image>
        </div>
    </template>
    
    <script>
        import VueUploadMultipleImage from 'vue-upload-multiple-image'
        import axios from 'axios'
    
        export default {
            name: 'uploader',
            data: function () {
                return {
                    dragText: dragText,
                    browseText: browseText,
                    primaryText: primaryText,
                    markIsPrimaryText: markIsPrimaryText,
                    popupText: popupText,
                    dropText: dropText,
                    maxImage: maxImage,
                    showPrimary: showPrimary,
                    accept: 'image/gif,image/jpeg,image/png,image/bmp,image/jpg',
                    dataImages: [],
                    multiple: true,
                    images: [],
                    uploadImageSuccess : '',
                    beforeRemove: '',
                    editImage : '',
                }
            },
            components: {
                VueUploadMultipleImage
            },
            methods: {
                data_change(data) {
                    console.log(data);
                    alert('asasa');
                }
            }
        }
    
    new Vue({
        el: "#car-image-upload",
        components: {
            'uploader': VueUploadMultipleImages
        },
    })
    </script>
    
    <div id="car-image-upload"><uploader></uploader></div>
    
    1 回复  |  直到 6 年前
        1
  •  1
  •   Steve Holgado    6 年前

    你的 uploadImageSuccess 设置为字符串,而不是方法。 你得到错误是因为 Vue上载多个图像 组件尝试将其作为函数调用。

    将方法添加到组件以处理成功的图像上载:

    ...
    
    methods: {
      uploadImageSuccess(formData, index, fileList) {
        // Do whatever you need here
      }
    },
    
    ...
    

    注意:你也应该这样做 beforeRemove editImage

    我希望这有帮助。