'List is empty' is not shown by default (as per the docs)

[siddhartharora002]

I thought the issue was with my code but I tried it on codesandbox and the issue is still there on vue 2 The noOptions slot works just fine, as I can see the value in the DOM but there is a display: none property on the list item that doesn't let it show.

Reproduction Link

https://codesandbox.io/s/vue-2-playground-forked-utp9zo

Steps to reproduce

1. Select all items

Expected behaviour

It should show List is empty

Actual behaviour

It doesn't show List is empty 😄

Miscellaneous

It's the display:none; that's causing the issue

[siddhartharora002]

So I don't know if this is meant to be used with async, but I am using it with the hideOnSelected prop, which makes the selected options disappear from the list.

I was checking the source code and found this:

<li v-show="showNoOptions && ((options.length === 0 || (hasOptionGroup === true && filteredOptions.length === 0)) && !search && !loading)">
  <span class="multiselect__option">
    <slot name="noOptions">List is empty.</slot>
  </span>
</li>

Findings:

1. options.length is not 0 as I can see in my vue-devtools
2. I am not using options group also here

the condition on the list item results to false, and thus it's showing display:none.

Should it not be filteredOptions.length === 0 instead of options.length === 0?

[milan-lakhani]

@akki-jat @shentao Could you please assign me this issue. I have resolved it and created a PR for the same. #1699 . Thanks.