Как экспортировать свойства из компонента?

Question

[Денис]

Добрый вечер. Подскажите возможно ли экспортировать свойство из React компонента. Например, я создал компонент в папке home. В этой папке кроме самого компонента home.jsx, есть index.js из которого экспортируется Home. У Home есть метод getAdress(), который возвращает строку с адресом. Могу ли я отдельно экспортировать этот метод в index.js? Вопрос именно акцентирован на то, можно ли экспортировать метод компонента отдельно от самого компонента!

Answer 1

[Anton Filippov]

так не пишите его в компоненте,

// Home.jsx
export const getAddress = () => {}
export default const Home = () => {}

// index.js 
import {getAddress}, Home from "./Home"

Comments

[Денис]

Но метод использует свойства из Home. Если я напишу его вне контекста, тогда внутри getAddress поменяется контекст

[Anton Filippov]

Денис, пишите метод "чистым", и передавайте аргументы со свойствами в него в виде аргументов, вы не показали код, поэтому сложно подсказывать конкретно.
Возможно вам вообще нужен redux, либо вариант Антон Спирин

Answer 2

[Антон Спирин]

class ExpampleComponent extends React.Component {
  static exampleStaticMethod() {
    // some stuff without using 'this' keyword
  }
}

export default ExpampleComponent;

import ExpampleComponent from './ExpampleComponent';

ExpampleComponent.exampleStaticMethod();

Comments

[Денис]

Такое решение приводит к ошибке

[Антон Спирин]

Денис, к какой ошибке? Дайте догадаюсь пытаетесь использовать this в статическом методе?
Для чего вам вообще понадобилось экспортировать метод?

[Денис]

Антон Спирин, Долго объяснять почему, я абстрактный пример привел, естественно реальная задача выполняет совсем другой код. Просто возникла необходимость экспортировать свойство , определенное в классе, то есть в Компоненте

[Антон Спирин]

Денис, я вам в соседнем ответе написал, что его нет в классе.
Хотите в объявить в классе, делайте так:

import {uniqueId} from 'lodash';

export class Home extends React.Component {
   static uid = uniqueId();

   // some code..
}

Но uid будет общий у всех экземпляров класса.
Обращаться к нему можно будет только через класс:
Home.uid

Answer 3

[Денис]

Ладно, а допустим структура Home следующая:

import {uniqueId} from 'lodash';

export class Home extends React.Component {
   uid = uniqueId();

   // some code..
}

Я хочу экспортировать uid в index.js

Comments

[Антон Спирин]

Вы понимаете, что вызов uniqueId() произойдет только при создании экземпляра? И пока он не создан свойства uid в прототипе не существует. Более того это будет не метод, а свойство.

[Anton Filippov]

вы делаете это неправильно, и ошибка не в коде, а в вашем подходе.