Использование свойства из файла enum в React возвращает заголовки не определено

Question

У меня есть простой пользовательский компонент в React, который принимает строку как свойство и отображает текст. Я пытаюсь загрузить свое текстовое содержимое из const в файл enums js, который находится в моей папке sr c. Я импортирую файл в родительский компонент и в index.js, но когда я пытаюсь его использовать, я получаю 'titles' is not defined, как я могу правильно использовать константу из файла? Вот соответствующий код:

import React from 'react';
import enums from '../../enums.js'
import CustomHeading from '../CustomHeading/CustomHeading.jsx'


class SecondColumn extends React.Component {

  render() {
    return <div className="second-column">

      <div className="second-column__about-me">
        <CustomHeading text={titles.ABOUT_ME} className="second-column__centered-heading" />
        <img className="second-column__first_part__test-img-col" src={require("../../assets/images/fake-image.png")} alt="fake img for now" />
        <div className="second-column_first_part_text-parent">
          <p className="second-column_first_part_text-parent__text-body">Lorem ipsum dolor, sit amet consectetur adipisicing elit.
          Molestiae molestias tempora ratione dolorum, tenetur laborum blanditiis id  Molestiae molestias tempora ratione dolorum, tenetur laborum blanditiis id
          Molestiae molestias tempora ratione dolorum, tenetur laborum blanditiis id  Molestiae molestias tempora ratione dolorum, tenetur laborum blanditiis id
          Molestiae molestias tempora ratione dolorum, tenetur laborum blanditiis id  Molestiae molestias tempora ratione dolorum, tenetur laborum blanditiis id
           </p>
        </div>
      </div>

      <div className="second-column__first_part">
        <CustomHeading text={'My astrological readings'} className="second-column__centered-heading" />

       </div>
       </div>
  }
};

export default SecondColumn;

А вот файл enums:

const titles = {
    ABOUT_ME: 'About me'
}

export default titles

Я также попытался вызвать его с помощью enums.titles.ABOUT_ME, но это не сработало либо

Answer 1

Вместо вызова по

enums.titles.ABOUT_ME

Позвоните по номеру

enums.ABOUT_ME

Это должно сработать.

Answer 2

Ваш enums.js файл нуждается в экспорте по умолчанию.

const titles = {
    ABOUT_ME: 'About me'
};

export default titles;

Кроме того, вы неправильно обращаетесь к объекту перечислений. Измените titles.ABOUT_ME на enums.ABOUT_ME в вашем компоненте. Или измените имя вашей импортированной константы на titles.

Импортируя как titles:

// Replace this line
import enums from '../../enums.js';

// With this line
import titles from '../../enums.js';