Tengo la siguiente configuración donde tengo una función TomorrowDate() que devuelve una fecha. Quiero pasar esto como apoyo. Pero en el componente Child esto no está definido . Supongo que hay algo que va mal al pasar el valor devuelto.
¿Cómo debo hacer eso?
const Parent = () => { const tomorrowDate = () => { return new Date() } return ( <Child minDate={tomorrowDate()} test={"test"} /> ) } class Child extends Component { componentWillMount() { console.log("props are", this.props) } render(){ // DO STH } }
La salida es...
los accesorios son {test:"test", minDate=undefined}
Simplemente copié y pegué su código y si ve el resultado de este fragmento, está funcionando sin ningún problema.
const Parent = () => { const tomorrowDate = () => { return new Date() } return ( <Child minDate = {tomorrowDate()} test = {"test"} /> ) } class Child extends React.Component { componentWillMount() { console.log("props are", this.props) } render() { return null; // DO STH } } ReactDOM.render( <Parent / > , document.getElementById("root"));
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script> <div id="root"></div>
No estoy seguro de cuál es el problema, pero he creado un fragmento que hace lo que quieres.
function Child({ minDate }) { return <div>{minDate.toLocaleString()}</div>; } function Parent() { const tomorrowDate = () => { return new Date(); }; return ( <Child minDate={tomorrowDate()} /> ); } // Ignore this ReactDOM.render( <Parent />, document.getElementById("react") );
<div id="react"></div> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>