El enrutador de extensión Backbone.js se usa para extender la clase de enrutador de Backbone en la que podemos crear nuestro propio modelo. También facilita la propiedad de instancia que se adjunta directamente a la función constructora del enrutador. Proporciona un hash de enrutador que empareja las rutas con la acción.
Sintaxis:
Backbone.Router.extend( properties, classProperties );
Parámetros: Acepta dos parámetros que se describen a continuación:
- Parámetros: este parámetro proporciona las propiedades de la instancia para la clase de enrutador especificada.
- classProperties: esta propiedad de clase se adjunta a la función constructora del enrutador.
Ejemplo 1: En este ejemplo ilustraremos el enrutador de extensión Backbone.js. Crearemos nuestra propia clase de enrutador con la ayuda del método extender.
HTML
<!DOCTYPE html>
<html>
<head>
<script src=
"https://code.jquery.com/jquery-2.1.3.min.js"
type="text/javascript">
</script>
<script src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js"
type="text/javascript">
</script>
<script src=
"https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js"
type="text/javascript">
</script>
</head>
<body>
<h1 style="color: green;">
GeeksforGeeks
</h1>
<h3>BackboneJS Router extend</h3>
<script type="text/javascript">
var Router = Backbone.Router.extend({
routes: {
'#rout1': 'role1',
'#rout2': 'role2',
},
role1: function () {
document.write(
"Illustrating Router extend!!!"
);
},
role2: function () {
document.write(
"Illustrating Router extend!!!"
);
}
});
var appRouter = new Router();
document.write(JSON.stringify(appRouter));
</script>
</body>
</html>
Producción:
Enrutador de extensión Backbone.js
Ejemplo 2: en este ejemplo, agregaremos una función inicial a nuestra clase de enrutador personalizada que llamará cada vez que se llame a una nueva instancia de clase.
HTML
<!DOCTYPE html>
<html>
<head>
<script src=
"https://code.jquery.com/jquery-2.1.3.min.js"
type="text/javascript">
</script>
<script src=
"https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.8.2/underscore-min.js"
type="text/javascript">
</script>
<script src=
"https://cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.2/backbone-min.js"
type="text/javascript">
</script>
</head>
<body>
<h1 style="color: green;">
GeeksforGeeks
</h1>
<h3>BackboneJS Router extend</h3>
<script type="text/javascript">
var Router = Backbone.Router.extend({
routes: {
'': 'r1',
},
r1: function () {
document.write(
"Illustrating Router extend!!!"
);
}
});
var appRouter = new Router();
Backbone.history.start();
</script>
</body>
</html>
Producción:
Enrutador de extensión Backbone.js
Referencia: https://backbonejs.org/#Router-extend
Publicación traducida automáticamente
Artículo escrito por satyam00so y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA