为输入框提供自动完成建议。
自动完成会在你输入时给出建议，并将选中的建议直接填入输入框。它不支持 value 属性。
如果你需要显示一个标签但存储另一个值（例如显示用户姓名但存储其 ID），请改用 combobox 组件。
<flux:autocomplete wire:model="state" label="State of residence"> <flux:autocomplete.item>Alabama</flux:autocomplete.item> <flux:autocomplete.item>Arkansas</flux:autocomplete.item> <flux:autocomplete.item>California</flux:autocomplete.item> <!-- ... --></flux:autocomplete>|
属性
|
描述
|
|---|---|
| wire:model |
要将输入值绑定到的 Livewire 属性名称。
|
| type |
HTML 输入类型（例如：text、email、password、file、date）。默认值：text。
|
| label |
显示在输入框上方的标签文本。
|
| description |
显示在标签下方的说明性文本。
|
| placeholder |
当输入为空时显示的占位文本。
|
| size |
输入框尺寸。可选项：sm、xs。
|
| variant |
视觉样式变体。可选：filled。默认：outline。
|
| disabled |
若为 true，禁止用户与输入框交互。
|
| readonly |
若为 true，使输入框为只读。
|
| invalid |
若为 true，为输入框应用错误样式。
|
| multiple |
用于文件输入时，允许选择多个文件。
|
| mask |
使用 Alpine 的 mask 插件的输入掩码模式。例如：99/99/9999。
|
| icon |
显示在输入框起始位置的图标名称。
|
| icon:trailing |
显示在输入框末尾位置的图标名称。
|
| kbd |
显示在输入框末尾的键盘快捷键提示。
|
| clearable |
若为 true，当输入框有内容时显示清除按钮。
|
| copyable |
若为 true，显示复制按钮以复制输入框内容。
|
| viewable |
用于密码输入时，若为 true，显示切换以展示/隐藏密码。
|
| as |
将输入框渲染为不同元素。可选：button。默认：input。
|
| class:input |
直接应用到输入元素（而非外层容器）的 CSS 类名。
|
|
插槽
|
描述
|
|---|---|
| icon |
显示在输入框起始位置的自定义内容（例如图标）。
|
| icon:leading |
显示在输入框起始位置的自定义内容（例如图标）。
|
| icon:trailing |
显示在输入框末尾的自定义内容（例如按钮）。
|