# TextArea

多行文本框组件

- 使用方式跟原生一致。
- 可通过defaultValue设置默认值,如果是通过请求获得的数据请使用value，defaultValue只有初始赋值有效。
- 可通过value和onChange事件配合使用手动设置输入值。
- 可通过设置count判断是否显示当前输入字数。
- 可通过设置maxLength配置最大输入字数。

主要属性和接口：

- defaultValue:默认值
  如：`<Textarea defaultValue="测试" />`
- value&onChange:
  如：`<Textarea value={this.state.value} onChange={()=>{this.setState({value:"测试"})}} />`
- count:是否显示当前输入字数, 默认false不显示, 配合maxLength使用
  如：`<Textarea count maxLength={150} />`

### 方法

### 属性

- classPrefix
- count
- defaultValue
- maxLength
- value

### 事件

- onChange

Extends Component
Defined in: `src/Textarea.js:17`
Module: 表单组件

Available since 0.3.0

## Constructor

### TextArea

`TextArea ()`

Defined in `src/Textarea.js:17`

Available since 0.3.0

#### Example:

    import React, { Component } from "react";
    import {Textarea} from "phoenix-ui";
    import Code from "./code/code";

    export default class textarea extends Component{

        constructor(props,context){

            super(props,context);

            this.state = {
                name:"默认值defaultValue",
                words: "value和onChange配合使用",
                MAX_LENGTH: 100
            };
        }

        setValue(key,e){
            let o ={};
            o[key || e.target.name] = e.target.value;
            this.setState(o);
        }

        render(){
            return(
                <div>
                    <h2 className="comp-title">Textarea</h2>
                    <h3 className="comp-type">count(默认false) 是否计字数</h3>
                    <div className="content">
                        <h3 className="comp-tip">默认不计数</h3>
                        <Textarea placeholder="请输入..." />
                        <h3 className="comp-tip">count配合maxLength计数</h3>
                        <Textarea count maxLength={this.state.MAX_LENGTH} placeholder="请输入..." />
                    </div>
                    <Code target="textarea-count" />

                    <div className="content">
                        <h3 className="comp-tip">defaultValue 默认值</h3>
                        <Textarea defaultValue={this.state.name} placeholder="请输入..." />
                        <h3 className="comp-tip">value和onChange配合使用</h3>
                        <Textarea value={this.state.words} onChange={this.setValue.bind(this,"words")} placeholder="请输入..." />
                    </div>
                    <Code target="textarea" />
                </div>
            );
        }
    }

## 属性

### `classPrefix`

String

Defined in `src/Textarea.js:45`

样式前缀

Default:

`'textarea'`

### `count`

Boolean

Defined in `src/Textarea.js:70`

是否显示输入计数

### `defaultValue`

String

Defined in `src/Textarea.js:52`

默认值

### `maxLength`

Number

Defined in `src/Textarea.js:76`

可输入的总长度

### `value`

String

Defined in `src/Textarea.js:58`

值

## 事件

### `onChange`

Function

Defined in `src/Textarea.js:64`

输入时执行的回调