when a user selects a project I am trying to map the returned object inside (filterproject) to a child component called projectText. This mapping occurs inside a useEffect hook with a ternary operator but I get the error "Expected an assignment or function call and instead saw an expression"
How do I map the child component with the {filterproject} object?
Below is the Parent Component
import React, { useRef, useEffect, useState, useCallback } from "react";
import projectsData from '../data/projectsData';
import Project from './Projects';
import projectText from './ProjectText';
const App = (props) => {
const [projects] = useState(() => (projectsData.map((project) => <Project id={project.id} project={project} projectClick={() => {setFilterProject(project)}}/>)));
const [filterKey, setFilterKey] = useState("*");
const [filterproject, setFilterProject] = useState(false);
const [selproject, setSelProject] = useState();
useEffect(() => {
if (filterproject) {
filterproject !== false
? setSelProject(() => filterproject.map((selected) => <projectText id={selected.id} project={selected}/>))
: console.log("no selected project")
}
},
[filterproject]);
return (
<body>
<div id='sepLine'>
<div id="visHolder">
<div id="visContainer" style={{position: "relative", width: "840px", height: "1823px"}} >
{projects}
</div>
</div>
</div>
<div id='projectText'>
{projectText}
</div>
</body>
);
}
export default App;
And the child component looks like the following:
import React from "react";
import * as d3 from "d3";
const projectText = (props) => {
const { selproject } = props;
return(
<div className="descriptionText">
<h2 className="descrHead">{selproject.subtitle}</h2>
<h4>{selproject.title}</h4>
<h4>{selproject.start} | {selproject.kind}</h4>
<div>
<a href={selproject.link} target="_blank">
<img src={selproject.image} alt= {selproject.subtitle} className="descriptionImage"></img>
<span className="descriptionLink">enter</span>
</a>
</div>
{selproject.description}
</div>
)
}
export default projectText
{filterproject} object when selected shown below {id: , title: ,etc}
Any help would be appreciated. Thanks in advance!
question from:
https://stackoverflow.com/questions/65647496/mapping-of-object-to-a-child-component-in-a-ternary-operator 与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…