héroes del caso aquí un ejemplo:
El recorrido total del proyecto
La idea es: main.js como el programa de archivo de entrada, se puede escribir código relacionada con el encaminamiento, pero esto no quiere cumplir con el principio de responsabilidad única, no es propicio para el mantenimiento del código, así que usar otra gestión de documentos router.js ruta, pero tienen que hacer enrutador ruta .JS logró desempeñar un papel en main.js en.
Pasos detallados:
1. Escribir el appslider.vue componente público <enrutador ver>
2.App.vue, juego <enrutador ver> contenedores
3.router.js, la introducción y vue vue-router, antes de la introducción a la mirada node_modules si el paquete correspondiente ha sido instalado, y finalmente Vue.use (VueRouter).
4.router.js, el componente de importación que pasarán a ser Bar.vue, List.vue, Foo.vue
5.router.js configurado el encaminamiento de las rutas de
6.router.js Ejemplos de rutas: Nuevo nuevo VueRouter ()
7.router.js direccionador de destino de exportación
8.main.js introdujeron router.js
9. la opción de ruta de montaje enrutador nuevo ejemplo de Vue main.js
En la lista de héroes a la página de edición de rutas
Aquí registró una situación relativamente comunes, pero relativamente complejas que tienen que ver con casos similares en diferentes clic de los héroes en el botón Editar -> Interpretar la misma situación componente edit.vue".
Cuando la función usada en el presente documento de navegación, una función no sólo de la necesidad de llenar conjunto de empuje objetos necesarios para llenar los segundos valores de parámetro ID.
pasos que se detallan:
JS parte de 1.list.vue:
métodos->
showEditVue (ID) {$ Router.push los presente ({nombre: 'Editar', los params: {ID: ID}}).};
2.router.js , el complemento original de enrutamiento ID de configuración:
{ruta: '/ Editar /: ID'}
tal enfoque se llama dinámica de enrutamiento
3.edit.vue de:
la obtención de una dinámica de enrutamiento parámetros $ route.params.id el este.
4.edit. vue:
axios.get (+ el este URL \ route.params.id.) .then ((RES) => {} = this.formData res.data);
5.edit.vue en:
Montado () {el presente. getHeroById ();}
método de llamadas donde 4
6. 5 para unirse a los datos de destino adquiridos en la vista
