Блог

поэтому я пытаюсь получить объект истории из реквизитов в компоненте, над которым я работаю, и он всегда выдает ошибку. это класс, в котором я пытаюсь использовать объект истории

 import React from 'react';  const Admin = (props) =gt; { return (  lt;React.Fragmentgt;  lt;h1gt;Adminlt;/h1gt;   lt;button   onClick={()=gt;this.props.history.push("/edit/new")}  type="button" className="btn btn-primary btn-lg m-1"gt;  Add  lt;/buttongt;  lt;table className="table"gt;  lt;theadgt;  lt;trgt;  lt;th scope="col"gt;Namelt;/thgt;  lt;th scope="col"gt;Pricelt;/thgt;  lt;thgt;lt;/thgt;  lt;thgt;lt;/thgt;   lt;/trgt;  lt;/theadgt;  lt;tbodygt;  {props.prod.map(prod1 =gt;(  lt;tr key ={prod1.id}gt;  lt;tdgt;{prod1.name}lt;/tdgt;  lt;tdgt;{prod1.price}lt;/tdgt;  lt;tdgt;   lt;i   onClick={()=gt;this.props.history.push(`/edit/${prod1.id}`)  }  className="fas fa-edit"gt;lt;/igt;    lt;/tdgt;  lt;tdgt;  lt;span onClick={()=gt;props.delete(prod1)}gt;   lt;i className ="fas fa-trash m-2" gt;lt;/igt;  lt;/spangt;  lt;/tdgt;   lt;/trgt;   ))}      lt;/tbodygt;  lt;/tablegt;        lt;/React.Fragmentgt; );  

}

администратор экспорта по умолчанию;

и приложение.jsx, которое я назвал в маршруте, выглядит так

 lt;Route path="/admin" element = {lt;Admin  prod = {this.state.Product}  delete={this.deleteEntery}  editing = {this.editElement}  /gt;}/gt;  

Во — первых, вы не передаете «историю» в качестве поддержки компоненту администратора, если вы хотите использовать объект истории в своем компоненте, вам просто нужно будет импортировать его и использовать (не нужно передавать его в качестве поддержки).

 // Import it at the top of your file import { useHistory } from 'react-router-dom'  // Call this hook inside your functional component, history variable has all the required properties const history = useHistory()  

Вы не импортировали крючок истории использования и не объявили историю с его использованием.

Добавьте это для импорта:

 import { useHistory } from 'react-router-dom'  

вызовите историю использования внутри вашей функции, используя историю переменных:

 const history = useHistory()  

Если у вас возникла какая-либо ошибка импорта, используйте последнюю версию React, а также установите «react-router-dom» v5.2.0 с помощью этой команды: npm install 'react-router-dom@v5.2.0'