diff options
author | Francesco Cioria <firefelix@gmail.com> | 2017-01-04 15:31:08 +0100 |
---|---|---|
committer | Francesco Cioria <firefelix@gmail.com> | 2017-01-04 15:31:08 +0100 |
commit | 8ad64ef8459b8370901464fff95425384afd7cb0 (patch) | |
tree | 10ca125eb95d996eb28a8404762772ee5b94fd22 /examples/examples.js | |
parent | 9001ee2503041ec87e326bac50e8f5bf136e4789 (diff) | |
download | react-autosize-textarea-8ad64ef8459b8370901464fff95425384afd7cb0.zip react-autosize-textarea-8ad64ef8459b8370901464fff95425384afd7cb0.tar.gz react-autosize-textarea-8ad64ef8459b8370901464fff95425384afd7cb0.tar.bz2 |
clean examples.js code
Diffstat (limited to 'examples/examples.js')
-rw-r--r-- | examples/examples.js | 58 |
1 files changed, 34 insertions, 24 deletions
diff --git a/examples/examples.js b/examples/examples.js index d635610..622268d 100644 --- a/examples/examples.js +++ b/examples/examples.js @@ -4,35 +4,45 @@ import TextareaAutosize from '../src/TextareaAutosize'; class Example extends React.Component { - constructor(props) { - super(props); - this.state = { - value: 'replace me with your component' - }; + textareaStyle = { + padding: '10px 8px', + border: '1px solid rgba(39, 41, 43, .15)', + borderRadius: 4, + fontSize: 15 } - render() { - - const textareaStyle = { - padding: '10px 8px', - border: '1px solid rgba(39,41,43,.15)', - borderRadius: 4, - fontSize: 15 - }; + onResize = (event) => { + console.log(event); // eslint-disable-line no-console + } + render() { return ( <div style={{ fontFamily: 'sans-serif', margin: 15 }}> - <h2>Empty</h2> - <TextareaAutosize style={textareaStyle} placeholder='try writing some lines' /> - - <h2>Minimum Height</h2> - <TextareaAutosize rows='3' style={textareaStyle} placeholder='minimun height is 3 rows' /> - - <h2>Prefilled</h2> - <TextareaAutosize style={textareaStyle} defaultValue={'this\nis\na\nlong\ninitial\ntext'} /> - - <h2>{'You can compare with this normal react <textarea>'}</h2> - <textarea style={textareaStyle} defaultValue={'this\nis\na\nlong\ninitial\ntext'} /> + <h2>{'Plain "<TextareaAutosize />"'}</h2> + <TextareaAutosize + style={this.textareaStyle} + placeholder='try writing some lines' + onResize={this.onResize} + /> + + <h2>Minimum height is 3 "rows"</h2> + <TextareaAutosize + rows='3' + style={this.textareaStyle} + placeholder='minimun height is 3 rows' + /> + + <h2>Prefilled with initial value</h2> + <TextareaAutosize + style={this.textareaStyle} + defaultValue={'this\nis\na\nlong\ninitial\ntext'} + /> + + <h2>{'You can compare with this normal react "<textarea />""'}</h2> + <textarea + style={this.textareaStyle} + defaultValue={'this\nis\na\nlong\ninitial\ntext'} + /> </div> ); } |