Soy nuevo en React y estoy aprendiendo sobre los accesorios. Mi accesorio no muestra el color en Events.js Obtuve "Soy un automóvil" y no se mostró el rojo.
Este es mi componente Welcome.js:
import React from 'react' import ReactDOM from "react-dom"; function Welcome(props) { return <h2>I am a {props.color} Car!</h2>; } ReactDOM.render(<Welcome color="red"/>, document.getElementById('root')); export default Welcome;mi página Events.js:
import React, { useState } from "react"; import Calendar from "react-calendar"; import { render } from "react-dom"; import Form from "./Form"; import Welcome from "./Welcome" function Events() { const [date, setDate] = useState(new Date()); return ( <div className='app'> <Form/> <Welcome/> </div> ); } export default Events;No está configurando el accesorio en Events.js . Esto significa que el valor de props.color no está undefined cuando se llama a la función de representación. React ignorará undefined entre llaves.
Puede agregar un protector para asegurarse de ver un error si la propiedad no está definida:
function Welcome(props) { if (props.color == null) { throw 'color should be defined'; } return <h2>I am a {props.color} Car!</h2>; }