Reagire ES6: si può avere dimenticato di definire `render`

Question

ho attaccato per un po ', e non so dove è sbagliato, per favore aiutami

Ecco il messaggio di errore:

Warning: App(...): No `render` method found on the returned component instance: you may have forgotten to define `render`. 
Uncaught TypeError: inst.render is not a function 

qui è il mio codice:

import React from 'react'; 
import ReactDOM from 'react-dom'; 

console.log('Start') 

export class App extends React.Component{ 
    constructor(props) { 
    super(props); 
    console.log('getInitialState'); 
    return { status:true } 
    } 
    toggleState(){ 
    this.setState({status: !this.state.status}) 
    } 
    render() { 
    console.log('render'); 
     return (
      <div> 
       <h1 onClick={this.toggleState}>Hello</h1> 
      </div> 
     ); 
    } 

} 

ReactDOM.render(<App name='Vipul' />,document.getElementById('app')); 

Answer 1

Rimuovere return da constructor, e state deve essere come una proprietà in questo modo

0.123.516,41 mila

constructor(props) { 
    super(props); 
    this.state = { status: true }; 
} 

un'occhiata a questi due esempi

function App() { 
 
    return { status: true } 
 
} 
 
App.prototype.render = function() {}; 
 
console.log(typeof new App().render);

function App() { 
 
    this.state = { status: true }; 
 
} 
 
App.prototype.render = function() {}; 
 

 
console.log(typeof new App().render);

come si c un vedere in console si ottiene nel primo esempio undefined perché è il costruttore Appreturns new custom object e in secondo si ottiene il risultato corretto;