React watercooler
November 16, 2017 at 9:01pmReact watercooler
November 16, 2017 at 9:01pmAugust 2, 2021 at 2:32am
anyone
August 2, 2021 at 10:38am
so far i did this much export const UserCardDetails = ({ data }: Props): JSX.Element => {
const [current, setCurrent] = useState(0);
console.log(
current1 ${current}
);const onNextClick = (idx: number) => {
setCurrent(current === idx ? 0 : current + 1);
console.log(
setCurrent ${current}
);
};
const onPrevClick = (idx: number) => {
setCurrent(current === idx ? 0 : current - 1);
console.log(setCurrent ${current}
);
};const res = data.map((slide, idx) => {
return (
<Card key={slide.id}>
{idx === current && (
<Card.Body>
<Row>
<Col style={{ paddingBottom: '20px' }}>
<FaArrowAltCircleLeft onClick={() => onPrevClick(idx)} style={{ float: 'left' }} />
<FaArrowAltCircleRight style={{ float: 'right' }} onClick={() => onNextClick(idx)} />
</Col>
</Row>
<Row>
<Col>
<h5>{slide.title}</h5>
</Col>
</Row>
<Row>
<Col>
<img src={slide.url} alt={slide.title} />
</Col>
<Col>
<p>{slide.description}</p>
</Col>
</Row>
</Card.Body>
)}
</Card>
);
});
return <div>{res}</div>;
};
August 15, 2021 at 8:28pm
@ call me
August 19, 2021 at 6:11pm
How does react works when creating a function but was never called, but the import to a file works on the return
August 20, 2021 at 12:59pm
August 20, 2021 at 10:05pm
August 23, 2021 at 7:03am
August 23, 2021 at 9:58pm