La colección de Backbone.js es solo un modelo de conjunto ordenado simple. Al adaptarnos a modelos y colecciones, podemos evitar que la lógica del procesamiento de datos se coloque en nuestra capa de vista. Además, los modelos y colecciones proporcionan formas convenientes de trabajar con el backend, y cuando los datos cambian, las vistas de Backbone.js se pueden marcar automáticamente. De esta manera, se puede usar en los siguientes casos:
La copia del código es la siguiente:
Modelo: Animal, colección: zoológico
Por lo general, su conjunto solo es adecuado para un modelo, pero el modelo en sí no se limita al tipo del conjunto.
La copia del código es la siguiente:
Modelo: persona, colección: oficina
Modelo: Persona, Colección: Inicio
Aquí hay ejemplos de modelos/conjuntos comunes:
La copia del código es la siguiente:
var music = backbone.model.extend ({
inicializar: function () {
console.log ("Bienvenido al mundo de la música");
}
});
var álbum = backbone.collection.extend ({
Modelo: música
});
El código anterior nos dice cómo crear una colección. Pero no nos dice el proceso de manipular el conjunto con datos. Entonces, exploremos este proceso:
La copia del código es la siguiente:
var music = backbone.model.extend ({
Valores predeterminados: {
Nombre: "No especificado",
Artista: "No especificado"
},
inicializar: function () {
console.log ("Bienvenido al mundo de la música"); }
});
var álbum = backbone.collection.extend ({
Modelo: música
});
var music1 = nueva música ({id: 1, nombre: "Cómo extraño", Artista: "OMC"});
var música 2 = nueva música ({id: 2, nombre: "Lo que más duele", Artista: "Rascal Flatts"});
var myalbum = nuevo álbum ([Música 1, Música 2]);
console.log (myalbum.models);
Echemos un vistazo a la relación entre la colección Backbone.js y otros componentes:
1. Agregue un modelo a la colección
Como sabemos, un conjunto es una colección de modelos. Por lo tanto, podemos agregar modelos en la colección. Para agregar un modelo a una colección, podemos usar el método ADD. También podemos agregar el modelo al inicio de la colección, utilizando el método Unshift.
La copia del código es la siguiente:
var music3 = nueva música ({id: 3, nombre: "Sí, do", artista: "Rascal Flatts"});
Music.add (Music3);
console.log ('nueva canción agregada');
console.log (json.stringify (música));
2. Retire el modelo del conjunto
Muchas veces, tenemos la necesidad de eliminar algunos datos especificados de la colección. Para eliminar el modelo de la colección, necesitamos proporcionar la identificación del modelo. Si queremos reemplazar la colección original con un nuevo conjunto de datos completo, podemos usar el método de reinicio.
La copia del código es la siguiente:
Music.remove (1);
console.log ('Cómo extraído ...');
console.log (json.stringify (música));
3. Obtén y establezca
Si necesitamos obtener un valor de una colección en otro lugar del código, podemos usar el método GET directamente. En este punto, pasamos el valor de ID al modelo con la búsqueda.
La copia del código es la siguiente:
console.log (json.stringify (music.get (2)));
Hay una implementación interesante del método establecido del conjunto. El método establecido realiza actualizaciones "inteligentes" de la colección al pasar la lista de modelos. Si el modelo en la lista no está en la colección, se agrega a la colección. Si el modelo ya está en la colección, sus propiedades se fusionan. Si la colección contiene algún modelo que no pertenece a la lista, se elimina el modelo.
La copia del código es la siguiente:
var music = backbone.model.extend ({
// Este atributo debe establecerse como un valor predeterminado
Valores predeterminados: {
Nombre: ''
},
// Establecer el atributo de identificación para que la colección
Idattribute: 'ID'
});
var song = backbone.collection.extend ({
Modelo: música
});
VAR MODELS = [{
Nombre: 'OMC',
ID: 1
}, {
Nombre: 'Flatts',
ID: 2
}];
colección var = nueva canción (modelos);
colección.bind ('add', function (modelo) {
alerta ('addb')
});
Collection.bind ('eliminar', function () {
alerta ('agregar')
});
modelos = [{
Nombre: 'OMC',
ID: 1
}, {
Nombre: 'Flatts',
ID: 2
}, {
Nombre: 'Jackson',
ID: 3
}];
colección.add (modelos);
});
Como vimos anteriormente, ya teníamos 2 modelos de antemano, y cuando agregamos el 3er modelo, el modelo anterior seguía siendo el mismo.
IV. Constructor e inicialización
Cuando creamos una colección, podemos pasar la matriz inicializada del modelo. El comparador del conjunto se puede agregar como una opción. Si la opción de comparación pasada es falsa, se evita la clasificación. Si definimos una función de inicialización, esta función se llamará cuando se cree la colección. Las siguientes son varias opciones, si se proporcionan, se agregarán directamente al conjunto: modelo y comparador.
La copia del código es la siguiente:
Tabs var = new TabSet ([TAB1, TAB2, TAB3]);
var spaces = new Backbone.Collection ([], {
Modelo: espacio
});
5. Tojson
El método TOJSO devuelve una matriz en la colección que contiene cada atributo de hash modelo. Este método generalmente se usa para serializar y persistir todo el conjunto.
La copia del código es la siguiente:
var song = new Backbone.Collection ([[
{Nombre: "Flatts"},
{Nombre: "OMC"},
{Nombre: "Jackson"}
]);
alerta (json.stringify (canción));
6. Comparador
Por defecto, las colecciones no tienen comparadores. Si definimos un comparador, se puede usar para mantener el conjunto de algún tipo. Esto significa que al agregar un modelo, el modelo se inserta en la ubicación apropiada de la colección. El comparador se puede definir en Sortby, o indica propiedades ordenadas en una cadena.
La función de comparación de Sortby obtiene un modelo y devuelve un número o cadena.
La función de comparación de clasificación obtiene dos modelos. Si el primer modelo está por delante del segundo modelo, entonces devuelve -1; Si los dos modelos son del mismo nivel, entonces devuelve 0; Si el segundo modelo está por delante del primer modelo, entonces devuelve 1.
Echemos un vistazo al siguiente ejemplo:
La copia del código es la siguiente:
Var estudiante = Backbone.model;
VAR Students = new Backbone.Collection;
Students.comparator = 'Nombre';
Students.Add (nuevo estudiante ({nombre: "name1", roll: 9}));
Students.Add (nuevo estudiante ({nombre: "name2", roll: 5}));
Students.Add (nuevo estudiante ({nombre: "name3", roll: 1}));
alerta (estudiantes. PLUCK ('ROLLO'));
El conjunto que se comparará no se reordena automáticamente, incluso si modificamos las propiedades del modelo. Por lo tanto, debemos llamar a la clasificación cuando la estimación afectará el tipo después de modificar los atributos del modelo.
7. Ordenar
Al agregar modelos a una colección, la colección debe ser obligada a reordenarse. Para deshabilitar la clasificación al agregar un modelo de colección, puede pasar el parámetro {Sort: False}. Llamar al disparador ordenado verifica este parámetro.
La copia del código es la siguiente:
sortByType: function (type) {
this.sortKey = type;
this.sort ();
}
Y ver funciones:
La copia del código es la siguiente:
sortthingsbycolumn: function (evento) {
var type = event.currentTarget.classList [0]
this.collections.things.sortByType (tipo)
this.render ()
}
8. Pelección
Recuperación: elija un atributo de cada modelo en la colección, que es equivalente a llamar al mapa del iterador y devolver un solo atributo.
La copia del código es la siguiente:
var song = new Backbone.Collection ([[
{Nombre: "Flatts"},
{Nombre: "OMC"},
{Nombre: "Jackson"}
]);
Var nombres = Songs.Pluck ("Nombre");
alerta (json.stringify (nombres));
9. Donde
Dónde: Devuelve una matriz de modelos en la colección que coincide con las propiedades aprobadas, utilizando filtros.
La copia del código es la siguiente:
var song = new Backbone.Collection ([[
{Nombre: "Sí I Do", Artista: "Flatts"},
{Nombre: "Cómo extraño", Artista: "Cómo extraño"},
{Nombre: "Lo que más duele", Artista: "Flatts"},
]);
var artistas = canción. Where ({Artist: "Flatts"});
alerta (artistas.length);
10. URL
Configuración de propiedades de URL en la colección se referirá a la ubicación del servidor. Los modelos dentro de la colección utilizarán esta URL para construir su propia URL.
La copia del código es la siguiente:
var canciones = backbone.collection.extend ({
URL: '/canciones'
});
var canciones = backbone.collection.extend ({
url: function () {
devuelve this.document.url () + '/canciones';
}
});
11. Análisis
PARSE: Llamado por Backbone cuando obtenga, independientemente de si el servidor devuelve el modelo de la colección. Esta función pasa el objeto de respuesta original, que debería devolver una matriz de propiedades del modelo agregadas a la colección. La implementación predeterminada es la operación NO-OP. Pase simple a través de la respuesta JSON, sobrescribir esto con una API preexistente o una mejor respuesta del espacio de nombres.
La copia del código es la siguiente:
var canciones = backbone.collection.extend ({
parse: function (respuesta) {
Respuesta de retorno. Resultados;
}
});
12. extracción
Obtenga: extraiga el conjunto de modelo predeterminado de la colección del servidor y estén en la colección después de la recuperación. Esta opción hash acepta devoluciones de llamada de éxito o error, que pasa tres parámetros (establecer, respuesta, opción). Luego devuelva los datos del modelo del servidor. Se utiliza para configurar el modelo extraído fusionado.
La copia del código es la siguiente:
Backbone.sync = function (método, modelo) {
alerta (método + ":" + model.url);
};
var canciones = new Backbone.Collection;
Songs.Url = '/Songs';
Songs.fetch ();
Como puede ver anteriormente, hay muchas maneras de dominarlos para mejorar la calidad de su código.