No puedo averiguar cómo pasar una URL de fondo a: después de un className que obtengo de props . Aquí están mis métodos/clases relevantes de Javascript y CSS:

Tarjeta.js

 const Card = props => ( <OnVisible visibleClassName="card-appear" percent={50} className={classnames( "article-card p-8 pb-0", props.cardBackground, props.cardMobile, props.cardCollection )} > <ArticleHeader/> <ViewArticle/> </OnVisible> );

estilos.css

 .article-card { flex: none; min-height: 400px; max-width: 520px; margin-left: auto; margin-right: auto; background-color: transparent; font-family: gingerRegular, sans-serif; opacity: 0; transition: all 0.5s ease-out; cursor: pointer; } .article-card::after { content: ""; background: url(https://source.unsplash.com/user/erondu/1600x900); opacity: 1; top: 0; left: 0; bottom: 0; right: 0; position: absolute; z-index: -1; }

Como puede ver arriba, me gustaría pasar una URL de fondo personalizada a: después de props en lugar de asignar una URL estática en css.