如何映射不同的日期 API Javascript

Question

如何使用不同 API 的日期（例如 YouTube、Vimeo）？在状态下我有一个table和objects，objects是不同的。我将此 table 映射到 Component.

{items.map((item) => (<Item key={uuidv4()} product={item}></Item>))}

我不知道如何在目标路径不同时使用此处的道具来获得 title、img 和 likeCount。

YouTube 标题的路径：

const title = props.item.snippet.localized.title;

Vimeo 标题的路径：

const title = props.item.name;

我试过了，但没用。

export default function Video(props) {
    const title = props.item.snippet.localized.title || props.item.name;
    return (
        <div>{title}</div>
    );
}

Answer 1

您可以使用 ?? 来使用这个：

{items.map((item) => (<Item key={uuidv4()} product={item.name ?? item.snippet.localized.title}></Item>))}

否则更复杂的箭头函数也可以：

{items.map((item) => {
    const title = ...;
    return <Item key={uuidv4()} product={title/>;
})}

如果您的问题是 props.item.snippet.localized.title 错误，例如.snippet 是 undefined，试试 optional chaining:

const title = props.item.snippet?.localized?.title ?? props.item.name;

如何映射不同的日期 API Javascript

How map date with different API Javascript

javascript

reactjs

react-props