# FormItem 表单项

## 介绍

用于表单排版

## 引入

```js
import { Vue } from "vue";
import { FileItem } from "@bingoit/mobile-ui";

Vue.use(FileItem);
```

## 代码演示

### 基础用法

```html
<forme-item label="文本输入">
    <!-- van-field 不要设置label，否则会有两个label -->
    <van-field v-model="text"></van-field>
</form-item>
```

## API

### Props

| 名称     | 说明                                                                               | 类型     | 可选值          | 默认值  |
| -------- | ---------------------------------------------------------------------------------- | -------- | --------------- | ------- |
| label    | 表单项标签文本                                                                     | _string_ |                 | -       |
| required | 是否必填，仅控制显示左侧星号，不控制表单校验                                       | _number_ | `true`/`false`  | `false` |
| role     | 表单项角色, 不同 role 拥有不用表单项外观，当 role 为`select`时，会在右侧显示小箭头 | _string_ | `text`/`select` | `text`  |
| tip      | 提示文本                                                                           | _string_ | -               | -       |

### Events

| 事件  | 说明       | 回调参数       |
| ----- | ---------- | -------------- |
| click | 点击时触发 | _event: Event_ |

### Slot

| 名称    | 说明           |
| ------- | -------------- |
| default | 表单项内容     |
| label   | 表单标签       |
| tip     | 表单项提示信息 |