Maison > interface Web > js tutoriel > riot.js apprenant le routage [9]

riot.js apprenant le routage [9]

黄舟
Libérer: 2017-01-16 16:23:35
original
1644 Les gens l'ont consulté

Le système de routage de Riot est basé sur [Anchor Point Change] de hashChange. Il existe deux façons de surveiller les changements de point d'ancrage :

riot.route et riot.route.exec

Les différences entre les deux sont les suivantes :

1. se charge lorsque la page Après cela, exécutez-la une fois, et une seule fois

2 Une fois la page de route chargée, elle ne sera pas exécutée automatiquement

La route ne s'exécutera que
après le changement du point d'ancrage. L'utilisation est la même, mais le timing d'exécution est différent. Prenons exec comme exemple.

Les valeurs par défaut sont les suivantes :

[code]// .../index.html#123/da宗熊
riot.route.exec(function(id, name){
    // id = 123, name = da宗熊
    console.log(id, name);
});
Copier après la connexion
Le paramètre de rappel de la route est séparé par "/" par défaut.


Riot fournit également une méthode pour remplacer la valeur par défaut d'un itinéraire :

[code]// 定义路由新的取值方式: #!/user/home?id=123&name=xxx
riot.route.parser(function(path){
    // path 是 hash【除去#的那部分】 => !/user/home?id=123&name=xxx
    var raw = path.slice(1).split("?");
    var uri = raw[0],
        qs = raw[1],
        params = {};

    // 有搜索参数的话
    if(qs){
        qs.replace(/([^=&]*)=([^&])*/g, function(str, key, value){
            params[key] = value;
            return str;
        });
    };
    // 给下面riot.route.exec()和riot.route()的 第1 和 第2 个参数
    return [uri, params];
});
Copier après la connexion
La nouvelle surveillance d'itinéraire peut être utilisée comme ceci :

[code]// 假如链接如下: #!/user/home?id=123&name=xxx
riot.route.exec(function(uri, qs){
    // uri = /user/home
    // qs = {id: 123, name: "xxx"}
});
Copier après la connexion
Bien que l'historique soit non utilisé L'API corrige le lien, mais le point d'ancrage suffit.

Ce qui précède est le contenu de l'apprentissage du routage [9] avec riot.js. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (m.sbmmt.com) !


Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal