问题标签 [vue-select]

我在使用vue-select组件时遇到了一些自定义模糊和焦点行为的小问题。

我试图覆盖组件的模糊行为，如果用户点击离开并点击特定的预定义目标 - 例如，如果用户在#special-place选择打开时点击，则选择应该保持打开状态，直到任何其他元素收到重点。

下面的代码让我了解了大部分情况，但有一个小错误：如果打开了一个下拉菜单并单击了另一个选择组件，则第二个组件保持打开状态，无论后续单击如何。这是一个沙盒，有一个活生生的例子。

模板如下：

相关方法如下（不是最好的命名，我知道）：

我也知道这可能不是解决问题的最类似于 vue 的方法，所以如果有更好的方法来解决这个问题，我愿意接受建议。

我有一个返回国家列表的休息端点。它采用以下查询参数：

因此，带有searchQueryas ''、startFromas0和countas的查询10将返回列表中的前 10 个国家/地区。

带有searchQueryas Can、startFromas5和countas的查询3将从包含该字符串的国家/地区列表中返回第 5 到第 8 个国家/地区Can。

我想从vue-select修改分页示例，以使用上面的 rest api 来获取国家，而不是像示例中那样使用国家的静态列表。

Vue-select 文档也有基于ajax的示例。

但是，因为我是 Vue 的新手，所以我很难以我想要的方式将两者结合起来。

一些vue专家可以提供一些指针来实现我想要的。

这是我的分页示例，countries其形式为静态数组：

模板：

数据：

计算：

如何将其转换为countries从我的休息终点获取？

我的父母有这个表格：

这是我的下拉组件，使用vue-select：

我需要将countryCode值传递给其父级的form.country. 我尝试使用$emit，但我似乎无法弄清楚在选择时它将如何设置父值，而不是在提交时。

编辑：

提交的解决方案效果很好，我将在此处添加我的解决方案：

我在 v-select 中添加了一个输入事件：

在我的脚本中，我定义了 selected 和 setSelected 方法：

在父母中：

和父脚本：

版本 vue-select2 中的 Haixing-Hu/vue-select 在 vue2 中不起作用，需要一些帮助......我做的一切都像文档一样，但没有任何事情发生这是我的模板代码......

这是我的脚本代码...

bud 得到了这个... select2 没有显示并收到一个丑陋的警告...

我正在使用nuxt-vue-select来允许用户从一个数组中选择多个对象locations，然后我想使用Vuelidate来尝试验证数组中的至少一个项目已被选择/设置为模糊但是我无法vuelidate做到做这个。我在这里做错了什么？

模板

脚本

数组数据

我在我的 Vue 应用程序中使用 vue-select。我创建了一个组件作为 v-select 的包装器。为了只返回选项数组的特定列，我使用了 vue-select 的 :reduce 属性。

此代码有效，但我希望将静态val字符串作为动态 prop returnKey。这将作为道具传递给组件。

我应该使用什么语法来组合传递给 :reduce 的函数中的“option”字符串和“returnKey”的动态值以使其正常工作？

我有两个表单字段：国家和地区。首先，你必须选择一个国家而不是一个地区。如果选择了一个国家/地区，我会将区域（选项）添加到下一个组件：Region.

我使用 axios 为区域添加选项。

我遇到问题的场景：当用户选择一个国家/地区时，一个地区然后返回更改国家/地区。该区域需要重置。我尝试使用生命周期钩子来做到这一点，mounted但created没有VeeValidate检测到任何变化。因此该值已正确更改但未VeeValidate检测到它。我通过在内部添加watch(with nextTick)解决了它，mounted但我怀疑这是一个很好的解决方案。有没有人有其他想法？

我对Vue.js几乎没有经验。任何帮助表示赞赏。

这是我的全部SelectBox.vue：

我是 VueJS 的新手。

我正在尝试使用 vee-validate 验证 vue-select。

我试图手动验证它，但它当然不是一个好方法。

因此，我尝试使用 vuelidate 但无法获得预期的结果。

现在我正在尝试使用 vee-validate。验证工作正常

但问题是v-model。

我创建了一个全局变量product来计算数组的长度，并将其传递给v-model。这样当它的空产品的值为零时，我可以从vee-validation返回所需的结果。

这是.vue html 部分。

这是validation.js文件

我不希望这个产品价值在那里。我也知道这不是一个好方法。我无法将整个数组传递给 v-model，因为这样我就无法在其中推送选项。我也无法将单个选项传递给 v-model ，那么我将不会得到想要的结果。

All I want to validate v-selectwhen options array is empty. 有什么建议么？

我知道，Vue Select 文档指定选项应该是一个数组，但是有没有办法解决它？我想将对象键用作值，将对象值用作标签。

我的数据：

我知道我可以这样使用键作为选项，但我不知道如何使用值作为标签。有小费吗？

我正在尝试在标题的管理面板中使用 v-select（使用 CoreUI）。我有一个带有“display：flex”的容器 https://codepen.io/kat15pl/pen/NWNZgQg

我想我做错了什么......但我看不到什么:(我不想在打开选择时调整大小。我的意思是为什么输入不能是 100%？