问题标签 [vue-multiselect]

我正在尝试将参数传递给Vue.js中的@select事件函数

HTML

JS

我的问题：如何将billItem传递给onSelect_selectedGood以便我可以在函数内部访问它。

然后像 @select="onSelect_selectedGood(billItem)"这样实现这样的功能onSelect_selectedGood( billItem, option, id)

让我知道如何实现它。

我是 VueJs 的新手，我正在使用 vue-multiselect 并且需要获取已删除的项目信息。

例如：选择一个或多个项目并删除其中一个后，通过单击标签，我如何使用@remove 事件并获取我需要的所有信息，例如值和 id？

假设我有一个这样的数组：['food', 'farmacy']

如果从 vuejs-multiselect 中删除这些值，我如何访问它们？

我写 ：

我只是将 value 和 id 作为参数传递给toggleUnSelectLojas函数，但不知道如何找到我需要的信息：

我正在尝试用<router-link>选项填充 vue-multiselect 下拉列表。指定路由器链接到不同组件的常用方法是声明式地 in <template>，而 vue-multiselect 使用带有选项数组的绑定。任何想法如何通过这个？

我想重用 vue-multiselect 在组件之间导航。

想象一个带有 Vuex 的 Vuejs 应用程序。我想要一个多选下拉菜单。Vue 组件中的基本示例：

现在，如果我在这样的数据中初始化“值”：

多选下拉菜单已将“测试”作为已选择的选项。我也可以在单击时取消选择它并再次选择它，因为它在选项中。

如果我尝试像这样初始化我的值：

它不能完全工作。在选择区域/下拉搜索字段中，通常会显示带有所选项目名称的绿色框。对我来说，它不会在绿色框中显示字符串，它位于 this.$store.state.variableIwantPreselected中，而只是一个没有任何内容的绿色小框。

我想我错过了一些关于 Vuex 和生命周期钩子的东西，但我不知道是什么。

我目前正在开发一个支持多种语言的 Vue 网站。选定的语言存储在 vuex-store 中，我有这样的计算属性 lang

现在我在 v-ifs、节目、其他计算属性等中使用这个属性，它工作得很好。我遇到问题的只有一件事，那就是多选（https://vue-multiselect.js.org/）。计算的选项属性看起来像这样

现在的问题是，这不起作用。可能选项正在创建的生命周期挂钩中初始化，因此稍后不会更新。你有什么聪明的想法，我可以通过这个 vue-multiselect 使用多种语言吗？除了这个问题，我非常喜欢这个组件，所以我不想切换。

背景：

我正在从模态（具有子组件）内部添加新的参与者数据，并且每当子组件添加新参与者时，父组件中的多选应该使用新添加的值进行更新。

代码：

Moviecreatecomponent.vue（父组件）

Personcreatecomponent.vue（子组件）

我是 vue 的新手，我不知道我哪里出错了，任何建议，提示都会有所帮助。

有没有办法使用 vue-multiselect 显示例如“3 selected”而不是每个选择。我有一个设计，显示每个选择的空间有限。

标签槽似乎只允许更改每个选择。

使用Vue Multiselect创建一个无序列表，当用户按Enter键选择一个项目时，如何让焦点返回到输入？即：
1. 用户搜索项目
2. 用户点击回车
3. 项目被添加到列表中（如当前发生的那样）
4. 焦点返回到输入并关闭下拉菜单，以便用户可以输入新条目。

将非常感谢任何帮助:)

我尝试将 close-on-select 更改为 false 以正确返回焦点但使下拉菜单保持打开状态，这并不理想，因为它隐藏了下面的内容。

https://jsfiddle.net/hugodesigns/rtogxe4s/?utm_source=website&utm_medium=embed&utm_campaign=rtogxe4s

当前结果是一个项目被添加到列表中并且多选失去焦点，因此必须再次单击才能输入更多输入。

预期的行为是一个项目被添加到列表中并且焦点返回到多选，准备接受输入，下拉关闭。

我在我的 Vue 组件中使用https://vue-multiselect.js.org 。我正在使用 AJAX 更新选择列表选项，我在检查器中看到有 10 个值。

但是当我真正点击进入多选列表时，我只看到这些项目的一个子集，我不知道为什么......这是我的多选道具/事件：

Codesandbox：https ://codesandbox.io/s/vue-template-33327

重现步骤

1. 点击 vue-multiselect 显示选项面板
2. 选择几个选项
3. 单击“不可点击的提交”按钮
4. 观察奇怪的行为

正如我们所见，“不可点击的提交”按钮是不可点击的。只有当 vue-multiselect 失去焦点时才可点击（选项面板消失后）

有人可能会说，选项面板的出现导致按钮“不可点击”，然而，尽管选项面板仍然存在，但“可点击提交”按钮仍然是“可点击”的。

其他人可能会这样说，因为“不可点击提交”按钮从其先前位置移开导致点击事件处理程序不起作用。这就说得通了。但是，我还创建了一个增加高度按钮，它使 div 增加它的高度，以模拟按钮的位置变化。在这种情况下，“不可点击的提交”是可点击的..奇怪！

另一个奇怪的事情是@mousedown 事件在“不可点击提交”按钮的情况下起作用。但是，在这种情况下，表单没有提交。

这种奇怪的行为完全让我大吃一惊。我不知道是什么导致了这些行为。有谁知道怎么回事，求大神帮忙！因为归根结底，我需要将“不可点击的提交”按钮设为Clickable。

更新 1

另一个问题，为什么@mousedown事件有效但@click事件没有？

更新 2

然而，防止按钮移动解决了这个问题，是否有可能使按钮仍然可以点击，尽管它已经离开了之前的位置？