0

私は現在、流星のウェブサイトで簡単な todos チュートリアル アプリのマテリアル デザイン バージョンを作成しようとしています。ただし、アプリがAndroid用にコンパイルされているときに、ナビゲーションバーのボタンに触れたときに実際に何かを実行するのに問題があります。問題の gif - http://i.imgur.com/vRMhIfy.gif

HTML スニピット:

<header class="fixed-navbar">
    <nav class="light-blue" role="navigation">
        <div class="nav-wrapper container">
            <a id="logo-container" href="#" class="brand-logo">Simple Tasks</a>

            <ul class="left hamburger">
                <li><a href="#" class="categories hide-on-large-only" data-activates="mobile-demo"><i
                        class="mdi-navigation-menu"></i></a></li>
            </ul>

            <ul class="right">
                <li><a class="dropdown-button" href="#!" data-activates="dropdown1">Menu</a></li>
            </ul>


            <ul id="dropdown1" class="dropdown-content">
                <li><a href="#!">Account</a></li>
                <li><a href="#!">Settings</a></li>
                <li class="divider"></li>
                <li><a href="#!">About</a></li>
            </ul>
        </div>
    </nav>
</header>

<div class="side-nav fixed" id="mobile-demo" style="  min-height: 100%;">
    <div class="sidebar">
        <ul>
            <li><a href="">All Tasks</a></li>
            <li><a href="">Unsorted</a></li>
            <li><a href="">Placeholder</a></li>
            <li><a href="">Another Placeholder</a></li>
        </ul>
    </div>

</div>

関連する Javascript:

if (Meteor.isClient) {
    $( document ).ready(function(){
        console.log("Document ready!");
        $(".categories").sideNav();
    });
}

マテリアライズ css と javascript は、最新バージョンのマテリアライズ (アルファ リリース v0.96.1) を使用するこのパッケージのフォーク バージョンを介してアプリ プロジェクトに含まれています。

どんな助けでも大歓迎です！

4

1 に答える 1

1

これは、コード内の JavaScript エラーが原因である可能性が最も高いです。

通常、開発モードではファイルは連結されないため、エラーが発生しても、アプリの残りの部分の動作が停止することはありません。

これは本番モードでは異なります。単一の js 例外がある場合、残りのコードは実行されません。これがおそらく、サイド ナビゲーション クリック イベントをセットアップするために JS が実行されなかったように見える理由です。

これを修正するには、開発モードで JavaScript コンソールを使用してアプリをロードし、JS エラーを見つけて修正します。これを行うと、本番モードで正常に動作するはずです。

また$(".categories").sideNav();、テンプレートの onrendered コールバックで実行することをお勧めしますが、これはあなたの問題ではないかもしれません:

Template.xxxx.onRendered(function() {
    $(".categories").sideNav();
});

xxxx.categories navbar を含むテンプレートはどこにありますか。

于 2015-04-25T11:32:33.437 に答える