实现：无法在 Dropdown._makeDropdownFocusable 处将属性“tabIndex”设置为 null

Question

我正在尝试通过包含物化选择的玩笑来测试我的 vuejs 组件。在执行组件测试时，我在 materialize.js 中收到以下错误：

TypeError: Cannot set property 'tabIndex' of null at Dropdown._makeDropdownFocusable

如何修复这个错误？

Answer 1

使用 id 选择器代替类选择器。例如像这样调用下拉列表：

html :

<a class='dropdown-trigger' id="dropdowner" href='#' data-target='dropdown1'>Drop Me!</a>

                         <!-- Dropdown Structure -->
                         <ul id='dropdown1' class='dropdown-content'>
                           <li><a href="#!">one</a></li>
                           <li><a href="#!">two</a></li>
                           <li class="divider" tabindex="-1"></li>
                           <li><a href="#!">three</a></li>
                           <li><a href="#!"><i class="material-icons">view_module</i>four</a></li>
                           <li><a href="#!"><i class="material-icons">cloud</i>five</a></li>
                         </ul>

js：

$('#dropdowner').dropdown();

Answer 2

当输入字段未包含在具有类输入字段的 div 中时，可能会发生此问题：

  <div class="input-field">
    <input type="text" class="autocomplete"></input>
  </div>

添加一个带有“input-field”类的 div 可能会解决这个问题。