En el siguiente ejemplo, ¿cómo puedo usar el componente Post de tal manera que las publicaciones nuevas y las publicaciones antiguas tengan sus propias clases únicas que sigan las recomendaciones de BEM ?
.posts-new post o .posts-old post ) Lo que quiero es que className refleje lo nuevo frente a lo antiguo. Lo ideal post-new y post-old .
Un enfoque que he considerado es pasar "nuevo" o "antiguo" a través de un atributo de accesorios ( type="old" , por ejemplo) al componente Post y luego crear dinámicamente el className (esta publicación aprovecha ese enfoque ). ¿Es ese el enfoque recomendado para tal situación o hay otra técnica que no estoy viendo?
// Display new posts Posts className="posts-new" Post className="?" // Display old posts Posts className="posts-old" Post className="?"Al final, opté por usar un atributo para pasar "nuevo" y "antiguo" del componente Publicaciones al componente Publicaciones.
<Posts type="new" /> <Posts type="old" />Luego, en el componente Publicar, pude agregar esto al nombre de clase de la etiqueta de mi artículo a través de un literal de plantilla.
<article className={`post post-${props.type}`}>Según los comentarios que he recibido de otros desarrolladores, este es un enfoque aceptable.