0
286
Vistasusando el archivo .scss en lugar del archivo css en reaccionar
en mi proyecto estoy usando el archivo .sccs para css. ahora tengo un problema extraño. Tengo una extensión de navegador que viene sobre el componente de entrada. su image id es estática, así que necesito ocultarla. 
cuando lo inspeccioné, debajo está viniendo.
en mi archivo .scss escribí debajo del código.
#__lpform_react-select-3-input_icon{ visibility: hidden; display: none; } no funciona en absoluto. luego creé un archivo .css adicional y simplemente lo importé y funciona perfectamente bien. si escribo a continuación en mi archivo .scss , oculta toda la image incluida esta. Necesito deshacerme solo de esta imagen.
img{ visiblity:hidden ; } ¿Hay algo adicional que deba hacer en mi archivo scss para que funcione? porque el arquitecto no me permite crear un archivo .css adicional y me pidió que pusiera mis cambios en mi archivo . archivo scss .
mi pregunta es por qué funciona en el archivo css y no en el archivo scss . ¿Qué paso adicional debo hacer? ¿podría ayudarme con eso?
2 Respuestas
Responde la pregunta0
Para React necesitas instalar la biblioteca sass.
Instalación:
npm i sass
Crea tu archivo sass.
ex:
my-file.scss
Importe el archivo sass en su archivo javascript.
ex:
import './my-file.scss';
0
React empaqueta todos sus scss en un solo archivo y los enfoca en el elemento root , por lo que no funcionan para elementos fuera del elemento root . Si desea ocultar el img usando estilos, debe escribir esos estilos en una etiqueta de style en su archivo public/index.html .
<!-- public/index.html --> <body> <div id="root"></div> <!-- add this here --> <style> #__lpform_react-select-3-input_icon{ visibility: hidden; display: none; } </style> </body>O
Podrías usar la temida document.getElementById("#__lpform_react-select-3-input_icon") ; Ahora sé que se supone que no debe usarlo en proyectos de reacción, pero dado que este elemento se genera, como mencionó, a través de una extensión, reaccionar no tiene control sobre él, por lo que no hay una forma real de que pueda acceder a ese elemento. Por lo tanto, creo que el uso de document.getElementById() está justificado en este caso.