反应状态不渲染

Question

All I'm trying to do is render the state 'draft' onto a H1 tag and it simply won't do it! It's driving me nuts. What am I doing wrong?

The initial H1 tags of 'I can see this' are visible however the 2nd pair don't show up at all..

import React, { Component } from 'react';
import Header from '../components/Header'
import NewTodo from '../components/NewTodo'
import List from '../components/List'    

class TodoContainer extends Component{
  constructor(){
    super()
    this.state = {
      todos: ['bathroom', 'kitchen', 'loungeroom'],
      draft: 'READ ME!'
    }
  }    

  render(){
    return (
      <div>
        <h1>I can see this</h1>
        <h1>{() => this.state.draft}</h1>
      </div>
    )
  }
}    

export default TodoContainer

Answer 1

You need to write this line:

<h1>{this.state.draft}</h1>

Rather than this line:

<h1>{() => this.state.draft}</h1>

Example code: http://jsfiddle.net/w66zxefv/1/