const tasks = [
{
id: 1,
text: 'Doctors Appointment',
day: "Feb 5th at 2:30 pm",
reminder: true,
},
{
id: 2,
text: "Meeting at School",
day: "Feb 6th at 1:30pm",
reminder: true,
},
{
id: 3,
text: "Food Shopping",
day: "Feb 5th at 2:30pm",
reminder: false,
},
];
const Tasks = () => {
return (
<>
{
tasks.map((task) =>
<h3>{task.text}</h3>
)
}
</>
)
}
export default Tasks;
這是我的組件。最初我在箭頭函式中有花括號，所以它看起來像這樣：
tasks.map((task) => {
<h3>{task.text}</h3>
}
但是，這樣做會使文本消失。所以我洗掉了這些花括號，突然出現了文本。
為什么添加花括號會破壞這個箭頭函式？
謝謝！
uj5u.com熱心網友回復：
如果您在箭頭函式中使用花括號，則需要return關鍵字。
tasks.map((task) => {
return <h3>{task.text}</h3>
}
)
uj5u.com熱心網友回復：
花括號用于分隔函式體，因此您需要一個return回傳值的陳述句：
tasks.map((task) => {
return <h3>{task.text}</h3>
})
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/404680.html
標籤：