0

私はSPAプログラミングを始めており、page.jsで動作するアプリを持っています. stackoverflow と page.js を検索しましたが、ページがリロードされた (または共有またはブックマークされた後に読み込まれた) ときに /record/Name1 などの URL 要求を処理する方法がわかりません。

私が見る唯一の方法は、履歴 API を使用して、record.php?id=name のようなファイルを参照することです。しかし、stockoverflow で行われているように、より良い/より美しい方法があると思います。次のステップのチュートリアルまたはサンプルを教えてください。jquery のようなフレームワークは避けたいと思います (ただし、Polymer を使用します)。

ここに私のテストコードがあります。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Page.js test</title>
    </head>

    <body style="font-family: sans-serif;">
        <h2>Menu:</h2>
        <div>
            <a href="/">Home</a><br>
            <a href="/records">Records</a><br>
            <a href="/record/Name1">Record/Name1</a><br>
            <a href="/record/Name2">Record/Name2</a><br>
            <a href="/index_1.html" rel="external">external</a><br>
        </div>
        <hr>
        <h2>Content:</h2>
        <p id="main"></p>
    </body>

    <script src="bower_components/page/page.js"></script>
    <script>
        page('/', function () {
            document.getElementById("main").innerHTML = "Home";
        });
        page('/records', function () {
            document.getElementById("main").innerHTML = "Records";
        });
        page('/record/:name', function (ctx) {
            document.getElementById("main").innerHTML = ctx.params.name;
            //history.pushState(null, null, ctx.params.name);
        });
        page({
            hashbang: false // do not add #! before urls
        });
    </script>
</html>

助けてくれてありがとう。

4

0 に答える 0