iView OptionGroup不显示

时间:2018-06-06 04:25:00

标签: vue.js iview

开发环境是Vue + iView。

我想要的是使用Select的远程功能来搜索来自两个不同资源的结果。

正如所料,结果应显示在不同的OptionGroup中。就像iView示例页面中的示例一样。

但问题是没有使用OptionGroup(如下面的代码块),显示搜索结果。

<Select
    id="includeRegionGroup"
    :disabled="m_viewing"
    ref="dropdownIncludeRegions"
    filterable
    clearable
    remote
    :remote-method="searchRegions"
    :loading="m_searchingRegions"
    @on-change="addIncludeRegion"
    style="width:75%">
    <Option v-for="(region, index) in m_regions" :value="region.value" :key="index">
        {{region.name}}
    </Option>
    <Option v-for="(group, index) in this.includeGroups" :value="group.Id + '|' + group.Name" :key="index">
        {{group.Name}}
    </Option>
</Select>

但只要我将OptionGroup添加到Select组件(如下面的代码),结果就不会显示。不显示错误,但只是不显示。选项面板为空。

<Select
    id="includeRegionGroup"
    :disabled="m_viewing"
    ref="dropdownIncludeRegions"
    filterable
    clearable
    remote
    :remote-method="searchRegions"
    :loading="m_searchingRegions"
    @on-change="addIncludeRegion"
    style="width:75%">
    <OptionGroup label="Region">
        <Option v-for="region in m_regions" :value="region.value" :key="region.value">
            {region.name}}
        </Option>
    </OptionGroup>
    <OptionGroup label="Group">
        <Option v-for="(group, index) in this.includeGroups" :value="group.Id + '|' + group.Name" :key="index">
            {{group.Name}}
        </Option>
    </OptionGroup>
</Select>

知道为什么会发生这种情况以及如何解决这个问题?

0 个答案:

没有答案