Задача вывести Теги из объекта React JS
Есть файл Wall.js
import React from 'react'
import Post from '../Post/Post';
function Wall() {
const posts = [
{
id:2,
author: {
id: 1,
avatar: 'https://alif-skills.pro/media/logo_alif.svg',
name: 'Alif Skills',
},
content: 'Ну как, вы справились с домашкой?',
photo: null,
hit: true,
likes: 222,
likedByMe: true,
tags: ['deadline', 'homework'],
created: 1603774800,
},
];
return (
<div>
{posts.map(o => <Post key={o.id} post={o} />)}
</div>
)
}
export default Wall
и файл Post.js
import React from 'react'
function Post({post}) {
const {author} = post;
const {photo} = post;
return (
<article>
<header>
<img src={author.avatar} className="Post-avatar" width="50" height="50" alt={author.name} />
<h5>{author.name}</h5>
<div>{post.created}</div>
{post.hit && <span>HIT</span>}
</header>
<div>
<div className="Post-content">{post.content}</div>
{photo && <img src={photo.url} alt={photo.avatar} className="Post-photo"/>}
</div>
<footer>
<span className="Post-likes">
<img src={post.likedByMe ? 'https://alif-skills.pro/media/liked.svg' : 'https://alif-skills.pro/media/unliked.svg'} alt="likes" width="20" height="20" />
<span className="Post-likes-count">{post.likes}</span>
</span>
<Tags />
</footer>
</article>
)
}
export default Post
Надо сделать компонент Tags, который отображает список тегов и слово теги Сам компонент Tags отображается только тогда, когда в объекте поста есть поле tags чтобы в итоге было так
Источник: Stack Overflow на русском