Почему у меня в React возникает ошибка сборки модуля? - PullRequest
0 голосов
/ 29 мая 2020

Если кто может помогите пожалуйста. Я не могу понять этого. Я все время получаю сообщение об ошибке:

Неперехваченная ошибка: Ошибка сборки модуля: повторяющееся объявление «status»

У меня есть перехватчик с именем hook. js в файле, который читает это:

import React, { useState } from "react";

export const hook = () => {
  const [status, setStatus] = useState([
    { title: "Progress", view: 1, total: 20 },
    { title: "Pending Initial", view: 3, total: 1 },
    { title: "Pending Review", view: 3, total: 3 }
  ]);
  return { status };
};

затем main. js где я вызываю ловушку и получаю эту ошибку

import React from "react";
import { hook } from "./hook;

const StatusTable = ({ status }) => {
  const { status } = useComponentLogic(status);

  const StatusTableHeader = ({ status }) => {
    let header = Object.keys(status[0]);
    return header.map((key, index) => {
      return <th key={index}>{key.toUpperCase()}</th>;
    });
  };


  return (
    <div>
      <table id="status">
        <tbody>
          <tr>
            {StatusTableHeade()}
          </tr>
        </tbody>
      </table>
    </div>
  );
};

export default StatusTable;

Что я делаю не так ?

Заранее спасибо !!

1 Ответ

1 голос
/ 29 мая 2020

Это связано с тем, что описанные свойства вашего компонента StatusTable и возвращаемое значение хука useComponentLogic имеют одно и то же имя переменной, status, и это определенно не будет работать, поскольку они оба объявлены в одном и том же scope.

const StatusTable = ({ status }) => {
  const { status } = useComponentLogic(status);
...
}

Вы должны использовать разные имена для них обоих. Один из подходов - деструктурировать реквизиты status на другое имя свойства.

const StatusTable = ({ status: inputStatus }) => {
  const { status } = useComponentLogic(status);

  ...

}
...