Tengo un componente en React que estoy importando en index.js, pero está dando este error:
No se devolvió nada del render. Esto generalmente significa que falta una declaración de devolución. O, para no representar nada, devuelve nulo
índice.js:
import React from 'react'; import ReactDOM from 'react-dom'; import Search_Bar from './components/search_bar'; const API_KEY = 'AIzaSyCnpDObOLiiqN87YKJKZ-cxzdAsvYD1F-U'; const App = () => { return ( <div> <Search_Bar /> </div> ); } ReactDOM.render(<App />, document.querySelector('#root'));componente:
import React from 'react'; const Search_Bar = () => { return <input />; }; export default Search_Bar;Tuve el mismo problema en el método render() . El problema surge cuando regresas de render() como:
render() { return ( <div>Here comes JSX !</div> ); }es decir, si comienza el paréntesis en una nueva línea
Intenta usar:
render() { return ( <div>Here comes JSX !</div> ); }Esto resolverá el error.
Dado que está utilizando un componente sin estado como una función de flecha, el contenido debe estar entre paréntesis "()" en lugar de corchetes "{}" y debe eliminar la función de retorno.
const Search_Bar= () => ( <input />; );el problema esta en la devolucion, prueba esto:
return( );esto resolvió mi problema