naming nav dropdown with bem

问题:

which it is the best way to naming a dropdown menu with bem ?? use children nav-main__sub or modifier nav-main--sub ??

<ul class="nav nav-main">
<li class="nav__item">
    <a href="#" class="nav__link is-active">home</a>
</li>
<li class="nav__item nav__item--sub-nav">
    <a href="#" class="nav__link">About</a>
    <ul class="nav nav-main--sub">             
        <li class="nav-main--sub__item">
            <a href="#" class="nav-main--sub__link">Company</a>
        </li>
    </ul>
<li class="nav__item">
        <a href="#" class="nav__link">Contact</a>
</li>

回答1:

IMHO nav-main__sub, because it is not modifier.

<ul class="nav nav--main">
    <li class="nav__item nav__item--sub-nav">
        <a href="#" class="nav__link">About</a>
        <ul class="nav nav-main__sub">             
            <li class="nav-main__sub-item">
                <a href="#" class="nav-main__sub-link">Company</a>
            </li>
        </ul>
    </li>
</ul>

or easier:

<ul class="nav nav--main">
    <li class="nav__item nav__item--sub-nav">
        <a href="#" class="nav__link">About</a>
        <ul class="sub">             
            <li class="sub__item">
                <a href="#" class="sub__link">Company</a>
            </li>
        </ul>
    </li>
</ul>