JSX ничего не возвращает
У меня есть этот код в моем компоненте, я вижу, что есть значения, оцениваемые при отладке, но когда код завершает выполнение, я ничего не вижу в результате, что-то не так с моим JSX?
export default class TilesComponent extends React.Component<ITilesComponentProps, {}> {
public render(): React.ReactElement<ITilesComponentProps> {
return (
<div className = {styles.tiles}>
{this.props.structure.tiles != null &&
this.props.structure.tiles.map((tile) => {
{(
<div className = "tile">
<h1>{tile.tileName}</h1>
<h2>wassup</h2>
</div>
)
}
})}
</div>
)
}
}
Я все еще новичок в react / jsx, поэтому я могу что-то не так писать.
Спасибо.
@ Think-Twice тоже не сработал.
Ответы 1
Требуется исправление внутри карты
Неправильный:
this.props.structure.tiles.map((tile) => {
{(
<div className = "tile">
<h1>{tile.tileName}</h1>
<h2>wassup</h2>
</div>
)
}
})}
Правильный:
this.props.structure.tiles.map((tile) => {
return (
<div className = "tile">
<h1>{tile.tileName}</h1>
<h2>wassup</h2>
</div>
)
})
Полный фрагмент:
export default class TilesComponent extends React.Component<ITilesComponentProps, {}> {
public render(): React.ReactElement<ITilesComponentProps> {
return (
<div className = {styles.tiles}>
{this.props.structure.tiles != null &&
this.props.structure.tiles.map((tile) => {
return(
<div className = "tile">
<h1>{tile.tileName}</h1>
<h2>wassup</h2>
</div>
)
})}
</div>
)
}
}
Как насчет первого заявления о возврате? мне удалить это? не могли бы вы опубликовать полный фрагмент, чтобы я мог его понять? Благодарность
Сначала return относится к методу render, и вы должны сохранить его, как вы уже выяснили :) Если вы новичок в React, возможно, лучше просмотреть официальную документацию.
@devserkan Я просмотрел документацию, просто попробовал изучить ее в реальном приложении, поэтому некоторые вещи могут сбивать с толку при попытке применить концепции :)
Да, как упомянул @devserkan, постарайтесь понять концепции, чтобы их было легко применить в коде. Вы узнаете больше в React. Продолжай учиться. Удачи?
Удалите лишнее открытое {и закрытие} после tile.map ((tile) => {this