Семантический пользовательский интерфейс делает подменю появляться при нажатии, а не при наведении

Question

По отношению к классу раскрывающегося меню Semantic UI поведение UX по умолчанию для подменю состоит в том, что они автоматически отображаются при наведении курсора мыши. Hover не подходит для мобильного интерфейса, поэтому я пытаюсь найти информацию о том, как это изменить, чтобы отображать подменю при нажатии.

Я обнаружил упоминание параметра 'toggleSubMenusOn' в отношении поведения dropdown (). настройки, но это не имеет значения для результата.

Ниже приведен рабочий фрагмент, иллюстрирующий случай. Щелкните раскрывающийся список действий, чтобы отобразить меню, затем выберите параметр «Вставить», чтобы появилось подменю. Прежде чем вы сможете щелкнуть его, появится подменю, управляемое при наведении курсора мыши.

Итак, как, используя официальный подход Semantic UI, сделать так, чтобы подменю появлялось ТОЛЬКО при щелчке родителя?

Боковая точка: официальные документы здесь , как правило, очень хороши, может быть страница меню может быть обновлена ​​этой информацией?

$('.ui.dropdown')
  .dropdown({
   toggleSubMenusOn: 'click' 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css" integrity="sha256-9mbkOfVho3ZPXfM7W8sV2SndrGDuh7wuyLjtsWeTI1Q=" crossorigin="anonymous" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.js" integrity="sha256-t8GepnyPmw9t+foMh3mKNvcorqNHamSKtKRxxpUEgFI=" crossorigin="anonymous"></script>

<p></p>
<div class="ui container">


     
   <div class="ui vertical menu">
       <div class="ui dropdown item">
          Action
         <i class="dropdown icon"></i>
         <div class="menu">
            <a class="item"><i class="cut icon"></i> Cut</a>
            <a class="item"><i class="copy icon"></i> Copy</a>
            <div class="ui dropdown item">
               <i class="dropdown icon"></i> 
               Paste
               <div class="menu">
                  <a class="item" href="#"><i class="paste icon"></i>After</a>
                  <a class="item" href="#"><i class="paste icon"></i>As child</a>
               </div>
            </div>
         </div>
       </div>
   </div>
 
</div>