Question

我正在进入SPA编程并拥有一个带有page.js的工作应用程序。我搜索了stackoverflow和page.js，但是当重新加载页面（或在共享或加入书签后加载）时，无法弄清楚如何处理像URL / Name1这样的URL请求。

我看到的唯一方法是使用历史API并引用像record.php？id = name这样的文件。但我相信在库存溢出方面有更好/更美好的方式。有人可以指点我下一步的教程或样本。我想避免像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>

感谢您的帮助。

使用深层链接和漂亮网址在page.js中为SPA添加书签

0 个答案: