# CInput 文本输入框组件

## 功能说明

CInput 是一个基础的文本输入框组件，用于在表单中收集用户的文本输入。组件支持多种输入类型，可以设置占位提示文本，并且支持显示单位标识。

## 引用方式

```js
import { CInput } from '@components/forms/input';
```

## 组件参数

- `itemRes` (Object，必填)：表单数据资源对象，表单组件内部机制专用
- `type` (String，可选)：输入框类型
  - `text`：文本输入
  - `number`：数字输入
  - `password`：密码输入
  - `phone`：手机号输入
  - `idcard`：身份证号输入
  - `digit`：带小数点的数字输入
- `placeholder` (String，可选)：输入框占位提示文本
- `unit` (String，可选)：输入框单位，设置后会在输入框右侧显示单位文本
- `readOnly` (Boolean，可选)：只读模式，默认为 false

## 使用示例

### 基础用法

```html
<template>
  <CForm :form="form">
    <CFormItem name="username" label="用户名">
      <CInput type="text" placeholder="请输入用户名" />
    </CFormItem>
  </CForm>
</template>

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

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

### 带单位的输入框

```html
<CFormItem name="weight" label="重量">
  <CInput type="digit" placeholder="请输入重量" unit="kg" />
</CFormItem>
```

### 只读模式

```html
<CFormItem name="id" label="ID">
  <CInput type="text" readOnly />
</CFormItem>
```

## 注意事项

1. CInput 组件通常需要配合 CForm 和 CFormItem 组件一起使用
2. 组件会自动处理输入值，去除首尾空格和换行符
3. 当设置 `unit` 属性时，会在输入框右侧显示单位文本
4. 在只读模式下，输入框将不可编辑