ant-design/components/input/demo/textarea-resize.md
偏右 d2c541b4e2
fix: 🐛 Input.Search height affected by suffix (#23527)
* 🎬 improve Input demo code

* style: fix Input.Search height stretched by suffix

close #23523

* fix react key warning

*  fix demo snapshot
2020-04-23 18:11:11 +08:00

1.1 KiB

order title debug
99
zh-CN en-US
文本域 TextArea
true

zh-CN

用于多行输入。

en-US

For multi-line input.

import { Input, Button } from 'antd';

const { TextArea } = Input;

const defaultValue =
  'The autoSize property applies to textarea nodes, and only the height changes automatically. In addition, autoSize can be set to an object, specifying the minimum number of rows and the maximum number of rows. The autoSize property applies to textarea nodes, and only the height changes automatically. In addition, autoSize can be set to an object, specifying the minimum number of rows and the maximum number of rows.';

class Demo extends React.Component {
  state = {
    autoResize: false,
  };

  render() {
    const { autoResize } = this.state;

    return (
      <>
        <Button
          onClick={() => this.setState({ autoResize: !autoResize })}
          style={{ marginBottom: 16 }}
        >
          Auto Resize: {String(autoResize)}
        </Button>
        <TextArea rows={4} autoSize={autoResize} defaultValue={defaultValue} />
      </>
    );
  }
}

ReactDOM.render(<Demo />, mountNode);