1

我正在尝试访问 Vue dropzone 组件内的父组件属性。我想从 Vue dropzone 内部访问表单的照片字段,以便将图片分配给表单照片字段。代码如下:

我正在使用带有图片字段的 v-form:

JavaScript:

<script>
import vueDropzone from "vue2-dropzone";
export default {
 data() {

  return {
    form: new Form({
      id: "",
      name: "",
      email: "",
      password: "",
      type: "",
      bio: "",
      photo: ""
  }),


  dropOptions: {
  url: "https://httpbin.org/post",
  maxFilesize: 2, // MB
  maxFiles: 4,
  chunking: true,
  chunkSize: 500, // Bytes
  autoProcessQueue:false,
  addRemoveLinks: true,
  dictDefaultMessage: "<i class='fa fa-cloud-upload'></i>Arraste ou clique aqui!!!!!!!!",
  addRemoveLinks: true,
  duplicateCheck: true,
  init: function () {
    console.log('firstthis ',this)

    this.on("addedfile", function(file) {
       console.log("Added file ", file); 
      //  globalThis.form.photo = file // I want to assign the value of the file to the form field
    });
    // this.vdropzone-duplicate-file(file)
  }
},
  photoChanged: false,
};


},

components: {
  vueDropzone
},

HTML:

<div class="form-group">
    <label for="dropzone" class="col-md-12 control-label">Choose a profile 
    picture:</label>

<div id="dropzonedivid">
    <vue-dropzone id="dropvue" :options="dropOptions"></vue-dropzone>
</div>

</div>
4

0 回答 0