Dropzone.js - creating dropzones programmatically returns "dropzone is not a function"

Question

I'm trying to create dropzones programmatically through a function but I receive a element.dropzone is not a function error and I'm not quite sure why. I'm using Vue.js with Element UI

HTML

<div class="toUpload">
     <div class="el-upload el-upload--text">

JS

submitMessage (){
     return api.createMessage( messageToSend, ( message ) => {

     // some code
     this.insertAttachments( "toUpload", message.id );

     } )
},

insertAttachments ( element, messageId ) {
     element.dropzone( {
     url: '/messages/' + messageId + '/attachments',
     paramName: 'attachment',
     previewsContainer: false,
     uploadedMultiple: true,
     maxfiles: 10,
     parallelUploads: 10
 } )

Answer 1

The value of element is a String ("toUpload") at the point where you are calling element.dropzone(). To use the dropzone method like that, you need to call it on a jQuery element.

You probably meant something like this:

$('.' + element).dropzone( ...