EN
React - how to render boolean value?
1
answers
4
points
I have an array describing books and wanted to display it, but it doesn't render a boolean value
My code:
const App = () => {
const bookList = [
{
title: 'title1',
isOpen: true
},
{
title: 'title2',
isOpen: false
}
]
return (
<div>
{bookList.map(({ title, isOpen }) => {
return (
<div>
<p>{title}</p>
<span>Is open: {isOpen}</span>
</div>)
})}
</div>
);
};
export default App;
Output:
title1
Is open:
title2
Is open:
The output I want to get:
title1
Is open: true
title2
Is open: false
how to solve it?
1 answer
4
points
Try to use String()
function.
Example:
// ONLINE-RUNNER:browser;
const App = () => {
const bookList = [
{ title: 'title1', isOpen: true },
{ title: 'title2', isOpen: false }
]
return (
<div>
{bookList.map(({ title, isOpen }) => {
return (
<div key={title}>
<p>{title}</p>
<span>Is open: {String(isOpen)}</span>
</div>)
})}
</div>
);
};
const root = document.querySelector('#root');
ReactDOM.render(<App/>, root);
0 comments
Add comment