Реагировать на маршрутизацию.Как сгенерировать адрес - PullRequest
0 голосов
/ 13 мая 2018

ребята!Нужна помощь.

Я создаю ссылки на категории модуля FAQ.Есть проблема.Вот мой код и отчет об ошибках выше этого.

        <ul>
    {
      this.props.categories.map((category) => {
        return (
          <li className="text-white d-inline-block w-100 clearfix ml-0" key={ category.id }>{ category.name }
             <a className="btn btn-primary float-right" onClick={ () => {
               this.handleEditOpenModal(category.id);
             } }>Edit</a>
             <NavLink to={'/' + category.id } className="btn btn-warning float-right">Add To</NavLink>
             <a className="btn btn-danger float-right"> Delete </a>
           </li>
        );
      })
    }
    </ul>

Этот код дает мне эти ошибки

> Uncaught Error: Objects are not valid as a React child (found: object with keys {id, name}). If you meant to render a collection of children, use an array instead.
    in h1 (created by QuestionsAndAnswers)
    in div (created by QuestionsAndAnswers)
    in div (created by QuestionsAndAnswers)
    in QuestionsAndAnswers (created by Connect(QuestionsAndAnswers))
    in Connect(QuestionsAndAnswers) (created by DashBoardPage)
    in div (created by DashBoardPage)
    in div (created by DashBoardPage)
    in div (created by DashBoardPage)
    in div (created by DashBoardPage)
    in DashBoardPage (created by Route)
    in Route (created by AppRouter)
    in Switch (created by AppRouter)
    in div (created by AppRouter)
    in Router (created by BrowserRouter)
    in BrowserRouter (created by AppRouter)
    in AppRouter
    in Provider
    at invariant (invariant.js?7313:42)
    at throwOnInvalidObjectType (react-dom.development.js?cada:8591)
    at reconcileChildFibers (react-dom.development.js?cada:9503)
    at reconcileChildrenAtPriority (react-dom.development.js?cada:10127)
    at reconcileChildren (react-dom.development.js?cada:10118)
    at updateHostComponent (react-dom.development.js?cada:10370)
    at beginWork (react-dom.development.js?cada:10609)
    at performUnitOfWork (react-dom.development.js?cada:12573)
    at workLoop (react-dom.development.js?cada:12682)
    at HTMLUnknownElement.callCallback (react-dom.development.js?cada:1299)
> 
> The above error occurred in the <h1> component:
    in h1 (created by QuestionsAndAnswers)
    in div (created by QuestionsAndAnswers)
    in div (created by QuestionsAndAnswers)
    in QuestionsAndAnswers (created by Connect(QuestionsAndAnswers))
    in Connect(QuestionsAndAnswers) (created by DashBoardPage)
    in div (created by DashBoardPage)
    in div (created by DashBoardPage)
    in div (created by DashBoardPage)
    in div (created by DashBoardPage)
    in DashBoardPage (created by Route)
    in Route (created by AppRouter)
    in Switch (created by AppRouter)
    in div (created by AppRouter)
    in Router (created by BrowserRouter)
    in BrowserRouter (created by AppRouter)
    in AppRouter
    in Provider

Consider adding an error boundary to your tree to customize error handling behavior.

> react-dom.development.js?cada:1345 Uncaught Error: A cross-origin error was thrown. React doesn't have access to the actual error object in development. See react-crossorigin-error for more information.
    at Object.invokeGuardedCallbackDev (react-dom.development.js?cada:1345)
    at invokeGuardedCallback (react-dom.development.js?cada:1195)
    at performWork (react-dom.development.js?cada:12800)
    at batchedUpdates (react-dom.development.js?cada:13244)
    at performFiberBatchedUpdates (react-dom.development.js?cada:1646)
    at stackBatchedUpdates (react-dom.development.js?cada:1637)
    at batchedUpdates (react-dom.development.js?cada:1651)
    at Object.batchedUpdatesWithControlledComponents [as batchedUpdates] (react-dom.development.js?cada:1664)
    at dispatchEvent (react-dom.development.js?cada:1874)

Как я понимаю, проблема близка к строке

                 <NavLink to={'/' + category.id } className="btn btn-warning float-right">Add To</NavLink>

Если я не генерирую адрес (например, <NavLink to="/5ecf1cc7-e343-4ce9-bf71-26e02efeb7ba">...), в этом случае у меня нет проблем, но это не то, что мне нужно.

Что вы думаете?Thanx

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...