Vue
HTML
<script src="https://cdn.jsdelivr.net/npm/vue2-dropzone@3.5.2/dist/vue2Dropzone.min.js"></script>
<div id="app">
<vue-dropzone ref="myVueDropzone" id="dropzone" :options="dropzoneOptions"></vue-dropzone>
<button @click="updateUrl()">
Update
</button>
URL : {{ dropzoneOptions.url }}
</div>
CSS
body {
background: #20262E;
padding: 20px;
font-family: Helvetica;
}
#app {
background: #fff;
border-radius: 4px;
padding: 20px;
transition: all 0.2s;
}
li {
margin: 8px 0;
}
h2 {
font-weight: bold;
margin-bottom: 15px;
}
del {
color: rgba(0, 0, 0, 0.3);
}
Vue
new Vue({
el: "#app",
data: function(){
return {
dropzoneOptions: {
url : "https://google.com"
}
}
},
components: {
vueDropzone: vue2Dropzone
},
methods: {
updateUrl(){
console.log(this.dropzoneOptions.url);
this.dropzoneOptions.url = 'http://example.com';
console.log(this.dropzoneOptions.url);
}
}
})