javascript - 组件的条件渲染
问题描述
我试图仅在asset.id === collection.masterAssetId
. 如果是这种情况,应该会出现一个星形图标。我正在使用该getMasterId
功能来检查这种情况。有谁知道这里的错误是什么?
错误:
Parsing error: Unexpected token
70 |
71 | {
> 72 | if(asset.id === this.getMasterId(asset.id)){
| ^
73 | <FaStar />
74 | }}
应用程序.js
import React from 'react';
import './App.css';
import {collections} from "./data.js"
import {assets} from "./data.js"
import {FontAwesome, FaStar} from "react-icons/fa"
class App extends React.Component {
constructor() {
super()
this.state = {
collectionsarr: collections,
assetsarr: assets,
clickedassets: []
}
}
getMasterId(assetnr){
const assetnum = this.state.collectionsarr.find(element => element.masterAssetId === assetnr).masterAssetId
return assetnum
}
render(){
return (
<div className="App">
<h1>Sitecore coding challenge</h1>
<div className="left">
{this.state.collectionsarr.map(element =>
<div key={element.id}>
<p onClick={()=>this.handleAssetsClick(element.id)}>{element.name}</p>
<img src={this.getAssetPath(element.masterAssetId)} alt="pic"/>
<br></br>
</div>
)}
</div>
<div className="right">
{this.state.clickedassets.map(asset =>
<div key={asset.id}>
<img src={require(`./${asset.path}`)} alt="pic"/>
<p>{asset.name}</p>
<p>{asset.id}</p>
<button onClick={() => this.makeMaster(asset.id)}>Make master!</button>
<p>icon "this is the master</p>
{
if(asset.id === this.getMasterId(asset.id)){
<FaStar />
}}
<br></br>
</div>
)}
</div>
</div>
)
}
}
解决方案
推荐阅读
- java - 插入排序arraylist,按字母顺序对数字和名称进行升序排序
- php - 我应该如何解决这个涉及 PHP 函数静态的错误?
- php - 卷曲+文件方案不返回 PHP 7.3+ 中的标头
- java - 检查hashmap(Key)中是否出现参数的方法
- c++ - 我在这里正确传递参数吗?
- swift - 如何使用 SwiftUI 为可隐藏视图设置动画?
- javascript - 更改 CircularProgress 的颜色和位置?
- spring-boot - Spring Boot 指标 http.client.requests 不适用于 WebClient 反应式应用程序
- amazon-web-services - 在 AWS Elastic Beanstalk 中使用 sqlite db 部署 Flask 应用程序
- php - Laravel 查询优化 (SQL)