使用样式组件显示图像

我有一个关于动态分配图像的问题。

我尝试按每个案例显示每个图像(取决于每个数据的类型和totalCount)。

但是这个代码不起作用。

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});
`;

否则,如果变量“image”是绝对路径https://mdn.mozillademos.org/files/7693/catfront.png,那么它就工作了。

我不知道我怎样才能做到这一点,使用绝对路径和相对路径有什么区别。:0