- Java 双重比较
- java - 比较器与 Apache BeanComparator
- Objective-C 完成 block 导致额外的方法调用?
- database - RESTful URI 是否应该公开数据库主键?
我正在尝试为 Bootstrap 构建一个自定义指令,它生成一个 <select>
从 Bootstrap selectpicker 输入“选择器”另外我希望这个指令使用默认的 options
VueJS 用于填充 <select>
选项的功能所以 html 应该是这样的:
<select v-selectpicker="myValue" options="myOptions"></select>
现在我可以完美地创建指令并使用 bind
调用 selectpicker()
的方法元素上的方法。问题似乎是选项是在调用 selectpicker()
之后设置的。 .所以不知何故我需要等到设置选项,或者我必须再次调用 selectpicker(refresh)
设置选项时。
有人知道这是否可行吗?
最佳答案
仅当您从服务器提供选项时,所提供的答案才有效。尝试使用 Vue 数据作为选项来初始化 Bootstrap-select,它总是在呈现选项之前被调用。
我的解决方案是使用一个组件并将选项/选择名称和回调函数作为 Prop 传递,这样我就可以确保它们都已加载。
<select-picker :name.sync="itemsPerPage" :options.sync="itemsPerPageOptions" :function="changeItemsPerPage"></select-picker>
Vue.component('select-picker', {
template:'<select v-model="name" class="themed-select" @change="function">' +
'<option v-bind:value="option.value" v-for="option in options">{{ option.label }}</option>' +
'</select>',
name: 'selectpicker',
props: ['options', 'name', 'function'],
updated: function() {
console.log(this);
$(this.$el).selectpicker({
iconBase: 'fa',
tickIcon: 'fa-check'
});
}
});
关于jquery - Bootstrap selectpicker VueJS 指令,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32843868/
我正在使用下面的代码,我的问题是当我第一次选择时,位置列表没有加载。当我选择第二项时,子列表中的第一项将被填充。如果我选择第三个,则会填充第二个子项。 我确定我在某个地方犯了一个愚蠢的错误。
是否可以在多选选择器中使用 selected-text-format “static” 和 selected-text-format “count”? 这是我当前的选择器: 1 2
我正在尝试使用 bootstrap-select并从 javascript 引用它,但我总是收到错误:.selectpicker is not a function 我读到的有关此错误的所有内容都表明
我有两个下拉列表,一个用于国家/地区,另一个用于州。我希望状态根据国家/地区显示。我将 selectpicker 类添加到两个下拉列表中。但是当我在控制台中更改国家/地区时,它显示错误 错误 Type
我正在使用选择器 plugin .现在,我尝试默认选择所有选项,或者至少选择一个按钮来选择所有选项,而无需在下拉列表中单击。 目前演示仅在单击下拉菜单并单击按钮后才有效。 有什么想法吗? $('.se
我正在为表单使用 bootstrap-select。我在 HTML 文件的 header 中包含脚本(jquery、bootstrap-select)。 所有具有类“selectpicker
我正在使用 selectpicker,下拉列表显示两次,如图所示 当我删除 selectpicker 类时,它显示正常的下拉列表 Select a
我有一个运行良好的 Bootstrap 选择器(选择时会触发事件)。我有一个代码,当第一个(正在工作)发生变化时,它会创建第二个选择器。问题是,第二个选择器在被选择时不会触发事件(就像我用 jQuer
当我尝试使用两个 selectpicker 但在不同的选项卡中时遇到问题,如下面的代码 $(document).ready(function(){ $('.selectpicker').select
我有一个 Bootstrap Selectpicker 控件,我想用 Javascript 填充它,代码可以在简单的选择输入下正常工作,但是当我添加 class="selectpicker" 时,它不
我编写了一个函数来更新Bootstrap selectpicker: function LoadProductDetailings() { var productId = $(this).va
我需要选项 x 始终在所选内容中被选中。(为此选项禁用取消选择)。 这是我当前的模板代码 X Y 期望的输出:选项 X 应该是强制性的/始终选择/不能取消选择。 最佳答案 已
我用这个做了一个全局模态 #GlobalModal .modal-body .body-content { margin:0;
我正在尝试制作具有“无限深度”的 optional 。我创建了这些表,但是无法将它们提取到 selectpicker 中。我该怎么做? 在我的例子中,扇区是类别 这就是我所做的: CREATE TAB
我计划实现一个选择器,它将允许用户从下拉列表中选择多个选项。问题是,当我的后端从这个选择器中提取值时,这些值必须按照用户选择的顺序,而不是原始下拉列表的顺序。希望能得到一些帮助!预先非常感谢! 我正在
我正在使用 Bootstrap 选择器。它在页面加载时工作正常,但在下拉列表更改时它会给出 selectpicker 不是函数的错误。初始化 $(document).ready(function()
我正在使用 bootstrap selectpicker。我必须在弹出窗口的中心显示 selectpicker select 下拉菜单,但我不想让文本在 select 下拉菜单中居中。我可以显示按钮但
我正在使用以下 JS 为我的选择提供选项: //**** Instance des Bootstrap-SelectPicker **** $('.selectpicker').selectp
通过克隆 html 使用 javascript 动态创建选择列表,并在创建选择列表后,尝试使用 $(MySelectList).selectPicker(); 初始化选择列表似乎成功了,但也成功了调用
我正在尝试更改显示所选选项的选择器框的宽度,但无论我如何尝试都无法更改它,也无法更改框的颜色。 如有任何想法或建议,我们将不胜感激。 我假设应该更改框宽度的代码片段如下(如您所见,我一直将其设置为 2
我是一名优秀的程序员,十分优秀!