[Vuejs]-How to send files in Vuejs?

0๐Ÿ‘

I have no idea how to send files in VueJS. What I do know is that I ran into a similar issue with angularjs a year ago. My solution was to use javascript FormObject() for sending data to the server instead of just using Object(). I also had to write a custom directive which looked like this

<input data-file id="id_image" name="image" ng-model="museumMap" type="file">

myApp.directive('file', function() {
    return {
        require:"ngModel",
        restrict: 'A',
        link: function($scope, el, attrs, ngModel){
            el.bind('change', function(event){
                var files = event.target.files;
                var file = files[0];

                ngModel.$setViewValue(file);
                $scope.$apply();
            });
        }
    };
});

I know this doesnt directly answer your question, but hopefully it gives you a starting point. Id try using FormObject() first.

0๐Ÿ‘

After few hours of tests, I founded right way to post files with strings:

let data = new FormData();
data.append('token', self.$auth.getToken());
data.append('file', file);
data.append('cover', cover);
data.append('title', self.title);
data.append('desc', self.desc);

And then just send the data as usuall. Hope it helps someone in future.

Leave a comment