问题标签 [v-autocomplete]

i am using v-autocomplete with autofocus.

the autocomplete work correctly when user click on it and then type the input:

but when user type the input without clicking on v-autocomplete, v-menu does not appear :

however relative events emitted as expected and items are filtered.
surprisingly i tried the same code in vue (not nuxt) and it works properly!

我有一个 Vuetify 自动完成功能，带有多个选择的芯片，其建议下拉菜单未存储在本地，但当用户开始在输入字段中输入时，总是从服务器异步检索。代码看起来像这样：

（不幸的是，我无法让代码在 JSFiddle 中运行，因为我不知道如何在那里模拟异步调用。）

流程如下：

1. 用户关注 v-autocomplete 字段。对前 20 名足球运动员进行第一次调用服务器。
2. 用户开始键入字符串。使用字符串作为参数对服务器进行新调用，并返回新结果。
3. 用户从结果中选择一些足球运动员。
4. 用户键入一些新字符串，等等。

现在会发生什么？当用户键入新的搜索时，先前选择的筹码会立即消失。如果他从新的建议列表中选择一个筹码，则该筹码会显示在输入中，直到进行新的搜索，然后该筹码就会消失。这可以通过芯片不包含在建议中的事实来解释。我发现了一个关于它的技巧，即总是在建议中推送预先存在的选择，但这很丑陋，而且这不是用户所期望的。

我考虑改用组合框，但我不确定这是否能解决我的问题。

我试图通过 v-model 指令更新自定义组件中设置的 v-autocomplete 值，但这不能按预期工作，除非有一些用户交互。

在父组件中，当我尝试安装此组件时，我会这样做

这很好用，因为组件存在用户交互。

但是当我尝试像这样动态地使它

组件没有任何反应，并且不会更新以显示所选项目。

那么我该如何解决这个问题呢？

我制作了这个可以被另一个下拉字段过滤的自动完成字段。

在初始加载时，自动完成字段通过 graphQl 加载一堆数据。问题是初始加载的数据很大，需要一段时间才能完成。与此同时，用户可以选择过滤这个自动完成列表，从而发出另一个请求。过滤后的请求完成得更快，并且来自初始请求的数据会覆盖过滤后的结果。

我已经在使用 debounce 了。

有没有可能取消通过 apollo-client 完成的请求的方法？谢谢

我想更改下拉列表的框样式并为v-autocomplete下拉列表指定border-radius样式，如下图所示。

到目前为止我设计的就像下图一样。

到目前为止，我已将 menu-props 属性直接赋予v-autocomplete标签：

上面的代码只添加了v-autocomplete标签，没有添加border-radius样式。

有没有办法制作类似于您使用 Vuetify 看到的图像的东西v-autocomplete？

任何帮助，将不胜感激。

我有一个对象数组绑定到 v-autocomplete 的 item 属性。这是我的数据：

所以，我希望能够同时通过“文本”和“值”进行搜索。目前，我只能搜索其中之一。

我正在尝试将 v-autocomplete 组件外部范围内的某些数据属性 (isMenuActive) 绑定到其隐式创建的 v-menu 的可见性状态，而与触发取消打开或关闭此菜单的原因无关。所以不需要双向数据绑定，我只需要在菜单切换时改变 isMenuActive 状态，而不是相反。

我想知道是否有可能通过 menu-props 属性传递一些回调函数：

似乎也没有为此目的的适当事件。

在上图中，我有两个 v-autocomplete 框，一个用于名称，另一个用于电子邮件。有没有办法连接两个 v-autocomplete 框，当用户输入姓名或电子邮件信息时，它还会显示另一个框的选项。

在图像中的示例中，用户输入了名称并获得了结果，我将如何显示该名称的相应电子邮件？

这是两个 v-autocomplete 框的代码

这是我的手表代码

这是我的后端调用

我使用 Postman 来确保我的后端调用没有问题。

这是我的代码笔 https://codepen.io/aaronk488/pen/MWbKNOq?editors=1011

这是HTML

这是JS

这是 UI 的样子

有没有办法让两个 v-autocomplete 菜单同时显示？如果用户单击任一 v-autocomplete，则该 v-autocomplete 和其他 v-autocomplete 下拉菜单会同时显示选项。

创建了一个代码笔，当用户在第一个 v-autocomplete 中输入文本时，会出现第二个 v-autocomplete 的下拉菜单。我通过将 isFocused 更改为 true 来做到这一点。问题是光标移动到下一个 v-autocomplete。有没有办法停止这种或其他方式来显示第二个 v-autocomplete 的下拉菜单？

这是我的代码笔 https://codepen.io/aaronk488/pen/MWbKNOq?editors=1010

HTML

JS

图片