Call multiple nested functions in the same file that is not a functional or class component?-CodePudding

How I call other other functions from a helper file that isn't a component? I have multiple components using the same 3 functions but the 3 functions are all dependent on a dom event/event listener and requires the "this" to be passed down to other functions.

Do I need to create a functional component to hold these additional functions? What is the correct to call them?

NewItem.js

import React, { Component } from 'react'
import {funcA} from 'SomeHelper'
class NewItem extends Component {
  constructor(props) {
    super(props);
  }

  render() {
    return(
      <div>{funcA(userName, obj)}</div>
    )
  }
}

SomeHelper.js

export const funcA(userName, obj) => {
    return console.log( funcB(userName, obj), funcCalculate(obj) )
}

funcB(userName, obj) => {
  return "Hello World"   userName;
}

funcCalculate(obj) {
  let value = 1   1;
  //insert some code here.
  return value;
}

CodePudding user response：

Correct me if I'm wrong, because I'm not 100% sure if I understand your question.

Unless you are manipulating the UI in said 3 components, you can just go along with what you've already written.

CodePudding user response：

// This is exported and is publically available
// import {funcA} from 'path/to/file.js';
// To use 
//  funcA('jody', {});
export const funcA(userName, obj) => {
  // These functions are available within this JS file
  return console.log(funcB(userName, obj), funcCalculate(obj))
}

// These can only be called privatly through functions within this JS file
const funcB = (userName, obj) => {
  return "Hello World"   userName;
}

// These can only be called privatly through functions within this JS file
const funcCalculate = (obj) => {
  let value = 1   1;
  //insert some code here.
  return value;
}

// you can export more than 1 function as well

export API Docs