Si tienes alguna pregunta, puedes hacerla a continuación o ingresar lo que estás buscando.
Estoy tratando de cambiar el fondo de entrada según el useState hook en Styled Components en React. Aquí está mi código: const [searchActive, setSearchActive] = useState(true); <div classname=”search” searchactive=”{searchActive}”> <input id=”input”> </div> Aquí está mi código de Styled Component: .search { background: ${(searchActive) => (searchActive ? “red” : “yellow”)}; } . . . Read more
Creé algunos componentes utilizando styled components y su salida genera un nombre de clase cifrado que dificulta la depuración. const StyledMessageBlock = styled.div` display: flex; font-weight: 200; height: 25px; `; Entonces, intenté importar styled desde macros import styled from ‘styled-components/macro’; y el resultado sigue siendo el mismo. Luego intenté actualizar . . . Read more
Tengo el componente AutoComplete de mui en mi código, y lo estoy utilizando con su componente TextField de la siguiente manera: tsx <StyledAutoComplete id="xxx" clearOnEscape options={[…]} renderInput={(params) => ( <TextField {…params} label="clearOnEscape" variant="standard" /> )} /> Donde StyledAutoComplete es el siguiente componente personalizado: tsx export const StyledAutocomplete = styled(Autocomplete).MuiAutocomplete-option { . . . Read more
Tengo este componente estilizado, donde estoy intentando pasar el atributo DATA, que proviene de “props”. (Esta es la solución que tenemos en Stack Overflow) export const InlineEditReadViewErrorContainer = styled.div.attrs(props => ({ ‘data-cy’: props.dataCy }))` border: 2px solid #de350b; border-radius: 3px; `; Así es como uso este componente estilizado en el . . . Read more
Tengo un componente de react llamado App como se muestra a continuación, tiene un estado WHRatio, y mi componente div utilizará el valor de WHRatio para calcular el valor de height. De la siguiente manera, funciona, se puede obtener correctamente el estado WHRatio del componente padre. import React, { useState . . . Read more