I have a question about allocating images dynamically.
I tried to show each images by each cases(depending each data's type and totalCount).
But this code is not working.
export default function Title() {
let image =
"../../../assets/images/situations/situation_" + totalCount + ".png";
return (
<>
{types[totalCount - 1] === "situation" ?
<SituationTitleStyled img={image}>
...
</SituationTitleStyled>
}
</>
)
}
const SituationTitleStyled = styled.div`
...
background: url(${(props) => props.image});
`;
Otherwise, if the variable "image" is absolute path like "https://mdn.mozillademos.org/files/7693/catfront.png", then it works.
I don't know how i can this work and what is the diffence between using absolute path and relative path. :0
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…