aweary/react-ie11-textarea-placeholder.jsx

## react-ie11-textarea-placeholder.jsx
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
    <style media="screen">
    body {
      font-family: sans-serif;
    }
      textarea {
        display: block;
        margin: 10px;
        width: 500px;
        height: 70px;
      }
    </style>
  </head>
  <body>
    <div id='root'></div>
  </body>
  <script src='build/react-with-addons.js'></script>
  <script src='build/react-dom.js'></script>
  <script src="https://unpkg.com/babel-core@5.8.38/browser.min.js"></script>
  <script type="text/babel">
  class App extends React.Component {
    constructor() {
      super();
      this.state = {
        value: 'dfd'
      };
      this.onChange = this.onChange.bind(this);
    }
    onChange(event) {
      this.setState({ value: event.target.value });
    }
    render() {
      return (
        <div>
          <h2>Uncontrolled, no placeholder, default value</h2>
          <textarea defaultValue='defaultValue'/>
          <h2>Uncontrolled, placeholder, default value</h2>
          <textarea
            placeholder='placeholder'
            defaultValue='defaultValue' />
          <h2>Uncontrolled, placeholder, no default value</h2>
          <textarea placeholder='placeholder'/>
          <h2>Controlled, no placeholder</h2>
          <textarea value={this.state.value} onChange={this.onChange} />
          <h2>Controlled, placeholder</h2>
          <textarea value={this.state.value} onChange={this.onChange} placeholder='placeholder'/>
        </div>
      )
    }
  }
      ReactDOM.render(
        <App />,
        document.getElementById('root')
      );
    </script>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title></title>
	<style media="screen">
	body {
	font-family: sans-serif;
	}
	textarea {
	display: block;
	margin: 10px;
	width: 500px;
	height: 70px;
	}
	</style>
	</head>
	<body>
	<div id='root'></div>
	</body>
	<script src='build/react-with-addons.js'></script>
	<script src='build/react-dom.js'></script>
	<script src="https://unpkg.com/babel-core@5.8.38/browser.min.js"></script>
	<script type="text/babel">
	class App extends React.Component {
	constructor() {
	super();
	this.state = {
	value: 'dfd'
	};
	this.onChange = this.onChange.bind(this);
	}
	onChange(event) {
	this.setState({ value: event.target.value });
	}
	render() {
	return (
	<div>
	<h2>Uncontrolled, no placeholder, default value</h2>
	<textarea defaultValue='defaultValue'/>
	<h2>Uncontrolled, placeholder, default value</h2>
	<textarea
	placeholder='placeholder'
	defaultValue='defaultValue' />
	<h2>Uncontrolled, placeholder, no default value</h2>
	<textarea placeholder='placeholder'/>
	<h2>Controlled, no placeholder</h2>
	<textarea value={this.state.value} onChange={this.onChange} />
	<h2>Controlled, placeholder</h2>
	<textarea value={this.state.value} onChange={this.onChange} placeholder='placeholder'/>
	</div>
	)
	}
	}
	ReactDOM.render(
	<App />,
	document.getElementById('root')
	);
	</script>
	</html>