Как использовать троичную операцию в reactjs, когда состояние содержит ответ от вызова API

Question

Как использовать троичную операцию в reactjs, когда состояние содержит ответ от вызова API. Что происходит, когда я вызываю троичный оператор внутри реагирования? Jsx Состояние apiResults хранит ответ при вызове API, но может быть вероятность того, что нет ответ или какое-либо сообщение об ошибке, например, сетевое сообщение, поэтому я использовал ternery conding, но он не работает

<Modal.Body>
    {apiResults} ? <p>{apiResults.response}</p>  : <p>Network Signal Issue Please Try Again</p>
</Modal.Body>

Ошибка:

index.js:1406 Error: Objects are not valid as a React child (found: object with keys {response}). If you meant to render a collection of children, use an array instead.

Answer 1

Используйте свою троичную операцию в теге p. Как ниже:

<Modal.Body>
    <p>{apiResults ? apiResults.response : 'Network Signal Issue Please Try Again'}</p>
</Modal.Body>