Este es mi archivo App.js
import Data from "./second" function App() { return ( <div> <Data given_data = 'This is data'></Data> </div> ); } export default App; Este es mi archivo second.js
function Data(props) { return( <div > <p>{props.given_data}</p> </div> ); } export default Data; Si escribo props.given_data de second.js como props.given_dattttaa o algo más, no muestra ningún error, ¿por qué?
Sin ningún error, no puedo encontrar lo que he hecho mal.
¿Hay alguna forma de mostrar el error en la consola del navegador o en la terminal del editor?
Está utilizando Javascript simple, por lo tanto, no hay forma de determinar qué se pasa realmente como props hasta que se llama al código.
Esto es para lo que se inventó Typescript (más o menos). En términos generales, Typescript le permite usar Javascript pero con tipos, o en otras palabras: Typescript es Javascript con "alguna documentación adicional". En la documentación se proporciona una guía de inicio rápido.
Para su caso específico, puede escribir el objeto props de la siguiente manera.
// define whatever you are going to pass to props type DataProps = { given_data: string } function Data(props: DataProps){ console.log(props.given_data) .... } Una vez que haya realizado la configuración, notará que TypeScript se quejará si accede a algo diferente en props que en given_data .