uni-app 内置组件：Input

有问题请咨询gpt2023-11-14 7:09

Input 组件是 uni-app 中用于用户输入文本的基础组件。

API

Input 组件提供多种类型供选择，如文本、密码、数字等。

属性

Input 组件的主要属性如下：

value：输入框的初始内容。
type：input 的类型，有效值：text, number, idcard, digit, password。
password：是否是密码类型。
placeholder：输入框为空时占位符。
disabled：是否禁用。
maxlength：最大输入长度。
cursor-spacing：指定光标与键盘的距离。
auto-focus：自动聚焦，弹出键盘。
focus：获取焦点。
confirm-type：设置键盘右下角按钮的文字，仅在 type='text' 时生效。

事件

Input 组件的主要事件如下：

input：键盘输入时触发，event.detail = {value: value}，其中 value 为输入框的内容。
focus：输入框聚焦时触发，event.detail = {value: value}。
blur：输入框失去焦点时触发，event.detail = {value: value}。
confirm：点击完成按钮时触发，event.detail = {value: value}。

示例

HTML 部分：

html 复制代码

<view class="uni-form-item">
  <view class="uni-label">用户名</view>
  <input class="uni-input" type="text" placeholder="请输入用户名" @input="onInput" />
</view>

JavaScript 部分：

javascript 复制代码

export default {
  methods: {
    onInput(e) {
      console.log('输入的内容为：', e.detail.value);
    }
  }
}

在此示例中，每当用户在输入框中键入字符时，onInput 方法会被触发，并打印出当前输入框中的内容。

更详细的内容请参考最新的uni-app 官方文档。