# CTextArea 多行文本输入组件

## 功能说明

CTextArea 是一个多行文本输入组件，用于在表单中收集用户的多行文本输入。组件支持设置输入区域高度，可以通过行数或像素值来控制，并支持只读模式。

## 引用方式

```js
import { CTextArea } from '@components/forms/textarea';
```

## 组件参数

- `itemRes` (Object，必填)：表单数据资源对象，表单组件内部机制专用
- `height` (Number，可选)：文本域输入区域高度，单位为像素，默认为 94
- `rows` (Number，可选)：文本域输入区行数，设置后会覆盖 height 参数
- `readOnly` (Boolean，可选)：只读模式，默认为 false
- `placeholder` (String，可选)：输入框占位提示文本

## 使用示例

### 基础用法

```html
<template>
  <CForm :form="form">
    <CFormItem name="description" label="描述">
      <CTextArea placeholder="请输入描述内容" />
    </CFormItem>
  </CForm>
</template>

<script>
import { CForm, CFormItem } from '@components/forms/form';
import { CTextArea } from '@components/forms/textarea';

export default {
  components: {
    CForm,
    CFormItem,
    CTextArea
  },
  data() {
    return {
      form: {
        description: ''
      }
    };
  }
};
</script>
```

### 设置输入区域高度

```html
<!-- 通过像素值设置高度 -->
<CFormItem name="content" label="内容">
  <CTextArea :height="150" placeholder="请输入内容" />
</CFormItem>

<!-- 通过行数设置高度 -->
<CFormItem name="remark" label="备注">
  <CTextArea :rows="5" placeholder="请输入备注" />
</CFormItem>
```

### 只读模式

```html
<CFormItem name="description" label="描述">
  <CTextArea :readOnly="true" />
</CFormItem>
```

## 注意事项

1. CTextArea 组件通常需要配合 CForm 和 CFormItem 组件一起使用
2. 当同时设置 `height` 和 `rows` 参数时，`rows` 参数优先生效
3. `rows` 参数会按照每行 40px 的高度计算输入区域的总高度
4. 组件支持自动增高，当输入内容超过设定高度时，输入区域会自动增高
5. 在只读模式下，输入区域将不可编辑