如何在函数调用搜索事件时为 vue-select 传递动态 ajax-url？

Question

我想在 vue-js 中为多个组件使用一个函数。为此，我需要使两件事变得动态 - 1.ajax-url 和 2. 选项的数据集持有者。我根据此功能正常阅读 https://sagalbot.github.io/vue-select/docs/Advanced/Ajax.html。我有以下代码-

<v-select :options="fieldSet[name].dataSet" :url="/user/autocomplete?term=" @search="onSearch">
    <template slot="no-options">
            <button class="btn btn-block">Add New Item</button>
    </template>
</v-select>

onsearch方法如下link-

// here search and load parameter gives searchText and spinner for UX
onSearch: function onSearch(search, loading) {
    loading(true);
    // this.search(loading, search, this);
    // here i want to get options holder and ajax-url so that i can 
    // fetch data using ajax and assign to some dynamic variable (which is defined for particular field)
},

What i looked into is - , but could not determine what to do for v-select.

Answer 1

在我遇到同样的问题之前的一段时间，我对 /node_modules/vue-select/dist/vue-select.js 进行了以下更改，这些更改等于两个文件中的更改 -- /node_modules/vue-select/src/mixins/ajax.js 和 /node_modules/vue-select/src/components/select.vue、

It has two steps first change $emit.function parameters and register your new variable as props

make search for onSearch:{type:Function,default:function(t,e){}}} 我把它改成了 onSearch:{type:Function,default:function(t,e,url){}}} 因为这个 make search 函数会 return 三个参数..

并搜索 watch:{search:function(){this.search.length>0&&(this.onSearch(this.search,this.toggleLoading), 并将其更改为 watch:{search:function(){this.search.length>0&&(this.onSearch(this.search,this.toggleLoading,this.ajaxUrl,this.optionHolder), 因为这将 return 4 个参数 ajaxUrl 和 optionHodler 并观察它们，

现在我们需要 return 他们使用 $emit

搜索 this.$emit("search",this.search,this.toggleLoading))} 并将其更改为 this.$emit("search",this.search,this.toggleLoading,this.ajaxUrl,this.optionHolder))} 这将 return 四个变量使它们可以全局访问 ...

现在通过更改以下内容在 select.vue 文件中注册您的新参数 - 搜索 props:{value:{default:null}, 并将这两个 ajaxUrl:{type:String,default:''},optionHolder:{type:String,default:''}, 定义放在搜索文本之后...

这对我有用...让我知道它是否对你有用？