Как вызвать функцию из класса без рендеринга React-Native

Question

Предположим, у меня есть класс A и B

class A extends Component{
    render() {
        return null;
    }

    foo = (a) => {
        return a;
    }
}

...


export default connect(mapStateToProps, mapDispatchToProps)(A);

А затем позвоните foo() в классе B.

import A from 'path/to/A';

class B extends Component{
    let a;

    hey() {
        A.foo(a);
    }
}

И это дает мне

TypeError: _A.default is not a constructor

Я попробовал почти все.

1. Пытался позвонить new A().foo(a);, но не работал.
2. Пытался дать stati c функции в A. как static foo = () => ... но в этом случае он не может видеть реквизиты класса А. (Реквизиты класса А становятся неопределенными).
3. Пытался экспортировать сам класс и экспортировать значения по умолчанию для connect() отдельно и c.

Мой вопрос: как я могу использовать функцию класса A в классе B. Учтите, что у меня есть избыточность в обоих классах. В классе A находится бизнес-логика c, а в классе B - пользовательский интерфейс.

Пожалуйста, не закрывайте вопрос, потому что ни один из вопросов Stackoverflow не решил мою проблему. Заранее спасибо

---

РЕДАКТИРОВАТЬ

Предположим, что моя функция foo() такая же, как с глобальным состоянием и диспетчеризацией.

foo = () => {
    let length = this.props.prod.length;
    let id = this.props.prod[length-1].id + 1;

    this.props.addProd({name: 'LOADING', id: id});
}

this.props.prod от глобального государства. и this.props.addProd() - создатель действия, который работает для pu sh prod до глобального состояния.

Если бы я определил эту функцию без класса. Как я могу вызвать actionCreator или получить глобальное состояние в этой функции?

Answer 1

Во-первых, вам не нужно делать A компонентом, который вы можете экспортировать так же просто, как функцию, а затем вызывать его в B:

export function foo(a) {
   return a;
}

, затем в B вы вызываете эту функцию

import { foo } from 'path/to/A';

class B extends Component{
    let a;

    hey() {
        foo(a);
    }
}

если вам нужно избыточное состояние в функции foo, вы можете использовать его как параметр или я предлагаю использовать redux-sagas.

Answer 2

class A extends Component{
  render() {
      return null;
  }

  foo = (a) => {
      return <b>a</b>;
  }
}


class B extends Component{
  //let a;

  hey() {
      return new A().foo("a");
  }
  render() {
    return this.hey()
  }
}

var a = new A().foo("b")
console.log(a);
var b = new B().hey()
console.log(b);

export default function App() {
  return (
    <div className="App">
      <B/>
      <br />
      {new B().hey()}
    </div>
  );
}

Использование <B/> в jsx создает экземпляр.

Если <A/> экспортируется как подключенный класс с избыточностью - он может использовать избыточность.