Ya que tengo estos códigos en mi componente React y no quiero repetir el mismo código una y otra vez.
¿Hay alguna forma de utilizar el principio DRY?
Estoy haciendo una página de destino con estilo sass y descubrí que estoy repitiendo el mismo código una y otra vez.
<article className="about-company"> ABOUT THE COMPANY <div className="company"> <p>Founded</p> <p>2002</p> </div> <div className="company"> <p>Employees</p> <p>10,000 - 15,000</p> </div> <div className="company"> <p>Revenue</p> <p>Confidential</p> </div> <div className="company"> <p>Serios</p> <p>Serious B</p> </div> <div className="company"> <p>Raised</p> <p>$ 27M</p> </div> <div className="company"> <p>Industry</p> <p>Technology</p> </div> </article> <article className="about-company"> ABOUT THE ROLE <div className="company"> <p>Type</p> <p>Full-time</p> </div> <div className="company"> <p>Total Compansation</p> <p>$150,000 to $180,000</p> </div> <div className="company"> <p>Equity / Options</p> <p>Yes</p> </div> <div className="company"> <p>Travel</p> <p>Required 10% Travel</p> </div> <div className="company"> <p>Work from Home</p> <p>One Day a Week</p> </div> </article>Estos son mis códigos. ¿Alguien puede ayudarme a deshacerme de estos?
Coloque los valores en una matriz, luego itere.
let data = [{a:"Founded",b:"2002"},{a:"a",b:"b"}]; data.map((item) => ( <div> <p>{item.a}</p> <p>{item.b}</p> </div>