[Vuejs]-How to pass value to function from methods in Vue.js?

by

0👍

if both handlers are in the same file then you can send it like

methods: {
  getDataSource() {
    let self = this;
    arr.forEach((item) => {
      //debugger;
      let tokens = item.path.replace(/^\/|\/$/g, "").split("/");
      let fid = item.fid;
      let current = tree;
      for (let i = 0; i < tokens.length; i++) {
        if (!current[tokens[i]]) {
          current[tokens[i]] = {
            fid: item.fid
          };
        }
        current = current[tokens[i]];
      }
      let ffid = Number(item.fid) + 1;
      //Since that function is defined outside try calling it as below
      uploadFileChunk(ffid); // Note that the upload file Chunk accepts three arguments so make sure you pass the other two as well
    });
}

0👍

Just add the function as a method and use this

methods: {
  getDataSource() {
    let self = this;
    arr.forEach((item) => {
      //debugger;
      let tokens = item.path.replace(/^\/|\/$/g, "").split("/");
      let fid = item.fid;
      let current = tree;
      for (let i = 0; i < tokens.length; i++) {
        if (!current[tokens[i]]) {
          current[tokens[i]] = {
            fid: item.fid
          };
        }
        current = current[tokens[i]];
      }
      let ffid = Number(item.fid) + 1;
      this.uploadFileChunk(ffid)      
    });

  uploadFileChunk(fileData, uploadInfo, destinationDirectory) {
    let self = this;
    //debugger
    let reader = new FileReader();
    reader.onload = function() {
      console.log(reader.result);
    }
    reader['readAsDataURL'](fileData);
    return objectProvider.uploadFileChunk(
      fileData,
      uploadInfo,
      destinationDirectory
    );
  }
}

if you really wants to use it as a independent function, i would recommend you to create a helper file and import it

upload-helpers.js (The name is up to you)

export function uploadFileChunk(fileData, uploadInfo, destinationDirectory) => {
    let self = this;
    //debugger
    let reader = new FileReader();
    reader.onload = function() {
      console.log(reader.result);
    }
    reader['readAsDataURL'](fileData);
    return objectProvider.uploadFileChunk(
      fileData,
      uploadInfo,
      destinationDirectory
    );
  }

In your component Vue

import { uploadFileChunk } from './upload-helpers'

methods: {
  getDataSource() {
    let self = this;
    arr.forEach((item) => {
      //debugger;
      let tokens = item.path.replace(/^\/|\/$/g, "").split("/");
      let fid = item.fid;
      let current = tree;
      for (let i = 0; i < tokens.length; i++) {
        if (!current[tokens[i]]) {
          current[tokens[i]] = {
            fid: item.fid
          };
        }
        current = current[tokens[i]];
      }
      let ffid = Number(item.fid) + 1;
      uploadFileChunk(ffid)  
    });
}

Leave a comment