[Preguntas de la entrevista inicial] Preguntas de la entrevista inicial 2023 - Capítulo de Vue

Language 2023-10-05 03:35:48 views: null

Siempre hay altibajos en la vida de una persona. No siempre saldrá como el sol naciente, ni siempre será miserable. Los altibajos repetidos son entrenamiento para una persona. Por lo tanto, aquellos que flotan arriba no necesitan estar orgullosos; aquellos que se hunden abajo no necesitan ser pesimistas. Debemos ser francos y humildes, optimistas y emprendedores, y seguir adelante. ——Konosuke Matsushita

Hola a todos, mi nombre es Jiang Chen. En el entorno actual de Internet, todo el mundo debe haberlo sentido hasta cierto punto. En esta sociedad impetuosa, sólo manteniendo constantemente el carácter se pueden percibir diferentes beneficios y animarse unos a otros.

Una colección de las últimas preguntas de las entrevistas de 2023, así que esté preparado en todo momento.

Este artículo se publicó por primera vez en la cuenta pública de WeChat: Programador salvaje Jiang Chen

Todos son bienvenidos a dar me gusta, coleccionar y seguir.

Lista de artículos

¿Cuáles son las ventajas y diferencias de Vue.js en comparación con otros frameworks front-end como React y Angular?

  1. Simplicidad y facilidad de uso:

Vue.js es un marco liviano que es fácil de aprender y usar. Proporciona una API intuitiva y documentación clara, lo que permite a los desarrolladores crear aplicaciones rápidamente.
React y Angular son, en cierto modo, más complejos y requieren más costos de aprendizaje.

  1. Marco progresivo:

Vue.js se conoce como un marco progresivo que le permite adoptar gradualmente sus funciones. Esto significa que puede integrar Vue.js en su proyecto existente sin tener que reescribir toda la aplicación a la vez.
React y Angular pueden requerir más trabajo cuando se integran en proyectos existentes.

  1. Enlace de datos bidireccional:

Vue.js proporciona enlace de datos bidireccional directo para mantener los datos sincronizados entre vistas y modelos. Esto facilita a los desarrolladores la gestión del estado de sus aplicaciones.
React y Angular también admiten el enlace de datos, pero lo implementan de forma ligeramente diferente.

  1. Desarrollo de componentes:

Vue.js, React y Angular fomentan el desarrollo basado en componentes, pero Vue.js sobresale en este sentido. La definición de componentes de Vue es muy simple y fácil de reutilizar y mantener.
React usa JSX para crear componentes, Angular usa plantillas. Los sistemas de componentes de estos marcos también son potentes, pero pueden requerir más configuración.

  1. Ecosistema y comunidad:

React y Angular tienen ecosistemas enormes y soporte comunitario activo, con ricas bibliotecas y complementos de terceros.
El ecosistema Vue.js también está creciendo y, aunque es relativamente pequeño, la comunidad también es muy activa.

  1. actuación:

Vue.js funciona bien en términos de rendimiento y tiene un mecanismo DOM virtual que puede actualizar las vistas de manera eficiente.
React también usa DOM virtual y su rendimiento también es muy bueno. Angular puede requerir más trabajo de optimización del rendimiento en algunos casos.

  1. Herramientas y ecosistema:

Vue.js proporciona algunas herramientas poderosas, como Vue CLI, para crear proyectos rápidamente e integrarlos con bibliotecas oficiales como Vue Router y Vuex.
React y Angular tienen herramientas y bibliotecas similares, pero el ecosistema de herramientas de Vue es, en cierto modo, más intuitivo y fácil de usar.

  1. Casos de uso:

Vue.js es adecuado para aplicaciones pequeñas y medianas y aplicaciones de una sola página (SPA), así como para proyectos que requieren creación rápida de prototipos.
React y Angular son adecuados para aplicaciones de todos los tamaños, incluidas aplicaciones empresariales de gran tamaño. En resumen, elegir qué framework front-end utilizar depende de las necesidades del proyecto y las preferencias del equipo. Vue.js tiene ventajas en cuanto a simplicidad, facilidad de uso y desarrollo progresivo, lo que lo hace adecuado para muchos proyectos, pero React y Angular también tienen sus ventajas en aplicaciones a gran escala y proyectos de nivel empresarial.

¿Cuál es la diferencia entre una instancia de Vue y un componente? ¿Cómo se comunican?

La instancia de Vue y los componentes en Vue.js son dos conceptos diferentes, existen algunas diferencias importantes entre ellos y también hay diferentes formas de comunicarse.

1. Instancia de Vue:

  • Las instancias de Vue son uno de los conceptos centrales de Vue.js. Es un objeto Vue independiente que se utiliza para gestionar el estado, el comportamiento y el ciclo de vida de la aplicación.
  • Normalmente, se crea una instancia raíz de una aplicación Vue, que administra los datos y métodos de toda la aplicación. Puede utilizarlo new Vue()para crear una instancia de Vue.

2. Componentes:

  • Los componentes son bloques de código reutilizables en Vue.js que se utilizan para crear interfaces de usuario. Cada componente tiene su propio estado, comportamiento y plantillas.
  • Los componentes se pueden utilizar en plantillas como etiquetas, lo que le permite crear interfaces de usuario complejas dividiéndolas en partes mantenibles.
  • Los componentes se definen mediante Vue.componento utilizando componentes de un solo archivo ( archivos)..vue

forma de comunicación:

En Vue.js, las instancias y componentes de Vue pueden comunicarse de las siguientes maneras:

1. Accesorios:

  • Los componentes principales pueden pasar datos a los componentes secundarios a través de accesorios. Los componentes secundarios reciben datos a través de accesorios y los utilizan en sus propias plantillas.
  • Este es un método de flujo de datos unidireccional, donde los componentes principales pasan datos a los componentes secundarios.

2. Eventos personalizados:

  • Los componentes secundarios pueden notificar a los componentes principales sobre la ocurrencia de eventos activando eventos personalizados. Los componentes principales pueden escuchar estos eventos y realizar las acciones apropiadas.
  • Esta es una forma de comunicarse desde los componentes secundarios a los componentes principales.

3. Gestión estatal (como Vuex):

  • Para aplicaciones grandes, puede utilizar una biblioteca de administración de estado como Vuex para administrar el estado de la aplicación. Proporciona un almacén de estado centralizado donde todos los componentes pueden acceder y modificar los datos.
  • Esta es una forma de comunicación de alto nivel entre componentes.

4. Inyección de dependencia:

  • Vue.js proporciona un mecanismo de inyección de dependencia que le permite registrar algunos datos en componentes ancestros y luego acceder a estos datos en componentes descendientes sin pasar accesorios capa por capa.
  • La inyección de dependencia generalmente se usa para pasar alguna configuración global o estilos de tema.

Resumen:
las instancias de Vue son los objetos raíz de toda la aplicación y los componentes son módulos reutilizables en la aplicación. La comunicación entre ellos se logra principalmente a través de accesorios y eventos personalizados, pero para una gestión de estado más compleja, puede utilizar Vuex u otras bibliotecas de gestión de estado.

¿Qué es la función de enlace del ciclo de vida en Vue? ¿Cuál es el orden en que se ejecutan?

Los ganchos del ciclo de vida en Vue.js son un conjunto específico de funciones que le permiten ejecutar código durante diferentes etapas del ciclo de vida de su componente. Estas funciones de enlace se pueden utilizar para realizar tareas como inicialización, carga de datos, operaciones DOM, etc. Las funciones de enlace del ciclo de vida de los componentes de Vue se ejecutan en el siguiente orden:

  1. beforeCreate (antes de la creación):

    • Se llama inmediatamente antes de que se cree la instancia del componente.
    • En este momento, los datos y eventos del componente aún no se han inicializado.

  2. creado (después de la creación):

    • Se llama inmediatamente después de crear la instancia del componente.
    • Los datos del componente se han inicializado, pero aún no se han montado en el DOM.

  3. beforeMount (antes del montaje):

    • Se llama inmediatamente antes de que el componente se monte en el DOM.
    • En este punto, la compilación de la plantilla está completa, pero el componente aún no se ha representado en la página.

  4. montado (después del montaje):

    • Se llama inmediatamente después de que el componente se monta en el DOM.
    • En este punto, el componente se ha representado en la página y se pueden realizar operaciones DOM.

  5. beforeUpdate (antes de la actualización):

    • Se llama inmediatamente antes de que se actualicen los datos del componente.
    • Dentro de esta función de enlace, puede acceder al estado anterior, pero aún no se han aplicado los datos más recientes.

  6. actualizado:

    • Se llama inmediatamente después de actualizar los datos del componente.
    • En este punto, el componente se ha vuelto a renderizar y se pueden realizar operaciones DOM.

  7. beforeDestroy (antes de la destrucción):

    • Se llama inmediatamente antes de que se destruya el componente.
    • En este punto, el componente todavía está disponible y puede realizar algunos trabajos de limpieza.

  8. destruido (después de la destrucción):

    • Se llama inmediatamente después de que se destruye el componente.
    • En este punto, el componente ha sido completamente destruido y ya no está disponible.

Estas funciones de enlace del ciclo de vida le permiten ejecutar código en diferentes etapas para satisfacer las necesidades de su aplicación. Por ejemplo, createdla inicialización de datos se puede realizar en ganchos y mountedlas operaciones DOM se pueden realizar en ganchos. Tenga en cuenta que diferentes ganchos de ciclo de vida son adecuados para diferentes propósitos y debe elegir la función de gancho adecuada para realizar las tareas correspondientes según sus necesidades.

¿Cómo se implementa el enlace de datos bidireccional de Vue? Por favor dé un ejemplo.

El enlace de datos bidireccional de Vue.js se implementa a través de su sistema reactivo único. Este sistema utiliza el objeto ES6 Proxy o el método Object.defineProperty() para notificar a la vista que se actualice cuando cambian los datos. Esto significa que cuando modifica el modelo de datos, las vistas asociadas a él se actualizan automáticamente y viceversa.

Aquí hay un ejemplo simple que demuestra cómo implementar el enlace de datos bidireccional en Vue.js:

Plantilla HTML:

<div id="app">
  <input v-model="message" type="text">
  <p>{
   
   { message }}</p>
</div>

Código JavaScript para la instancia de Vue:

new Vue({
    
    
  el: '#app',
  data: {
    
    
    message: 'Hello, Vue!'
  }
})

En este ejemplo, usamos v-modeldirectivas para vincular <input>elementos bidireccionalmente a propiedades en la instancia de Vue message. Esto significa que cuando ingresa texto en el cuadro de entrada, messageel valor de se actualizará automáticamente y messagecuando el valor de cambie, el texto también se actualizará automáticamente.

Cuando ingresa texto en el cuadro de entrada, Vue actualizará automáticamente el valor ingresado al messageatributo, logrando así una actualización de la vista a los datos. A su vez, si modificas messageel valor del atributo en código JavaScript, el texto de la vista se actualizará automáticamente, logrando una actualización de datos a vista.

Este enlace de datos bidireccional mantiene los datos sincronizados con la vista, lo que simplifica enormemente la tarea de manejar la entrada del usuario y la presentación de datos en el desarrollo front-end.

¿Cuál es el papel de las propiedades calculadas y los observadores en Vue? ¿Cual es la diferencia entre ellos?

En Vue.js, las propiedades calculadas y los observadores se utilizan para manejar cambios en los datos, pero tienen diferentes funciones y usos.

Propiedades calculadas:

Una propiedad calculada es un tipo de propiedad en Vue.js cuyo valor se calcula en función de otras propiedades de datos, similar a una función. La función principal de las propiedades calculadas es encapsular la lógica de cálculo para que se pueda hacer referencia a ella directamente en la plantilla, y tienen un mecanismo de almacenamiento en caché que solo se volverá a calcular cuando cambien los datos dependientes.

Principales características y funciones:

  • Se utiliza para derivar o calcular un valor basado en un atributo de datos existente.
  • Con un mecanismo de almacenamiento en caché, solo se volverá a calcular cuando cambien los datos relevantes, lo que mejora el rendimiento.
  • Se puede hacer referencia a él directamente en la plantilla como un atributo normal.
  • Las propiedades calculadas se utilizan generalmente para operaciones simples de conversión, filtrado, formateo y otras operaciones.

Ejemplo:

<template>
  <div>
    <p>{
   
   { fullName }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      firstName: 'John',
      lastName: 'Doe'
    }
  },
  computed: {
    fullName() {
      return this.firstName + ' ' + this.lastName;
    }
  }
}
</script>

Vigilantes:

Los observadores son una forma en Vue.js de realizar operaciones asincrónicas o costosas personalizadas cuando cambian los datos. Puede escuchar cambios en una o más propiedades de datos y ejecutar funciones específicas cuando los datos cambian.

Principales características y funciones:

  • Se utiliza para realizar operaciones personalizadas cuando los datos cambian, como solicitudes asincrónicas o procesamiento de datos complejos.
  • No existe un mecanismo de almacenamiento en caché y la ejecución se activará cada vez que cambien los datos.
  • Las funciones de observador deben escribirse manualmente para manejar los cambios de datos.
  • Puede monitorear cambios en múltiples atributos de datos.

Ejemplo:

<template>
  <div>
    <p>{
   
   { message }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      value: 'Initial Value',
      message: ''
    }
  },
  watch: {
    value(newValue, oldValue) {
      // 在value属性变化时执行的操作
      this.message = 'Value changed: ' + newValue;
    }
  }
}
</script>

la diferencia:

  1. Los atributos calculados se utilizan principalmente para la conversión y derivación de datos. Tienen un mecanismo de almacenamiento en caché y solo se recalcularán cuando cambien los datos relevantes. Son adecuados para el procesamiento de datos simple. Se puede hacer referencia a ellos directamente en la plantilla como propiedades normales.

  2. Los observadores se utilizan para realizar operaciones personalizadas cuando cambian los datos. No existe un mecanismo de almacenamiento en caché y la ejecución se activará cada vez que cambien los datos. Adecuado para manejar operaciones asincrónicas complejas o situaciones en las que es necesario monitorear múltiples cambios de datos.

Dependiendo de sus necesidades específicas, puede optar por utilizar propiedades calculadas u observadores para manejar los cambios de datos. Generalmente, se prefieren las propiedades calculadas porque son más simples y de mayor rendimiento, mientras que los observadores se utilizan sólo cuando se requiere un manejo especial de los cambios de datos.

Hable sobre su comprensión de los componentes de Vue. ¿Cómo crear un componente Vue?

Los componentes de Vue son módulos reutilizables en aplicaciones Vue.js. Dividen una página en varias partes independientes, cada parte tiene su propio estado, plantilla y comportamiento. La componenteización es uno de los conceptos centrales de Vue.js, lo que hace que el desarrollo front-end sea más modular, mantenible y reutilizable.

Los pasos básicos para crear un componente Vue son los siguientes:

  1. Defina el componente: primero, debe definir un componente de Vue. Los componentes se pueden definir usando Vue.componentel método o usando componentes de un solo archivo (archivos .vue). A continuación se muestra Vue.componentun ejemplo de cómo definir un componente usando:
Vue.component('my-component', {
  // 组件的选项
  template: '<div>This is a custom component</div>'
})
  1. Uso de componentes en plantillas: una vez definido un componente, puede usarlo en la plantilla del componente principal. Por ejemplo:
<template>
  <div>
    <my-component></my-component>
  </div>
</template>
  1. Pasar datos al componente: puede pasar datos al componente a través de los accesorios del componente, para que el componente pueda recibir datos externos y usarlos en la plantilla. Por ejemplo:
<template>
  <div>
    <my-component :message="message"></my-component>
  </div>
</template>

<script>
export default {
  data() {
    return {
      message: 'Hello from parent component'
    }
  }
}
</script>

Dentro del componente, puede utilizar propspara recibir estos datos y utilizarlos en la plantilla:

<template>
  <div>
    <p>{
   
   { message }}</p>
  </div>
</template>

<script>
export default {
  props: ['message']
}
</script>

  1. Ciclo de vida del componente: los componentes también tienen funciones de enlace de ciclo de vida que le permiten ejecutar código en diferentes etapas del ciclo de vida. Estas funciones de enlace incluyen beforeCreate,,, etc., que se utilizan para realizar tareas como inicialización, carga de datos y operaciones DOM created.beforeMountmounted

  2. Eventos personalizados: los componentes pueden comunicarse entre sí a través de eventos personalizados. Los componentes secundarios pueden desencadenar eventos personalizados y los componentes principales pueden escuchar estos eventos y realizar las acciones correspondientes.

  3. Comunicación entre componentes: además de accesorios y eventos personalizados, también puede utilizar herramientas de administración de estado como Vuex para lograr la comunicación y el intercambio de datos entre componentes.

En resumen, los componentes de Vue son uno de los conceptos centrales de las aplicaciones Vue.js. Hace que el desarrollo front-end sea más modular y fácil de mantener, lo que le permite dividir la interfaz en múltiples partes reutilizables, cada parte tiene su propio estado y comportamiento. La creación y el uso de componentes es una parte importante del desarrollo de Vue.js, ya que le ayuda a crear aplicaciones front-end más eficientes y fáciles de mantener.

¿Qué son las directivas en Vue? Enumere algunas instrucciones de uso común e introduzca brevemente sus funciones.

En Vue.js, las directivas son tokens especiales que se pueden usar en plantillas para representar acciones en elementos DOM. Una directiva v-comienza con , seguido del nombre de la directiva, por ejemplo v-bind, v-ifetc. Las instrucciones se utilizan para vincular datos en la plantilla a elementos DOM y controlar la visualización, ocultación, representación y comportamiento de los elementos.

A continuación se muestran algunas directivas Vue de uso común y lo que hacen:

  1. v-bind:

    • Función: se utiliza para vincular los atributos de los elementos y vincular los valores de los atributos de los elementos a los datos de la instancia de Vue.
    • Ejemplo:<img v-bind:src="imageUrl">

  2. v-model:

    • Función: se utiliza para implementar un enlace bidireccional entre los elementos del formulario y los datos de la instancia de Vue, de modo que la entrada del usuario pueda actualizar los datos automáticamente y viceversa.
    • Ejemplo:<input v-model="message">

  3. v-for:

    • Función: se utiliza para recorrer los datos de una matriz u objeto y generar múltiples elementos.
    • Ejemplo:<li v-for="item in items">{ { item }}</li>

  4. v-if/ v-else-if/ v-else：

    • Función: se utiliza para controlar la visualización y ocultación de elementos según condiciones, similar a las declaraciones condicionales en JavaScript.
    • Ejemplo:<div v-if="show">This is shown</div>

  5. v-show:

    • Función: Se utiliza para controlar la visualización y ocultación de elementos según las condiciones, a diferencia de esto v-if, se controla a través de displaypropiedades CSS y no destruye ni recrea elementos.
    • Ejemplo:<div v-show="isVisible">This is shown</div>

  6. v-on:

    • Función: se utiliza para escuchar eventos DOM y ejecutar el método especificado cuando se activa el evento.
    • Ejemplo:<button v-on:click="handleClick">Click me</button>

  7. v-pre:

    • Función: omita el proceso de compilación de este elemento y sus subelementos y envíelos directamente como HTML sin formato.
    • Ejemplo:<div v-pre>{ { message }}</div>

  8. v-cloak:

    • Función: permanecer oculto entre el elemento y la instancia de Vue hasta que se complete la compilación de Vue.
    • Ejemplo:<div v-cloak>{ { message }}</div>

  9. v-once:

    • Función: solo renderiza elementos y componentes una vez, no se realizarán actualizaciones de respuesta.
    • Ejemplo:<span v-once>{ { message }}</span>

Estas instrucciones le permiten manipular fácilmente los elementos DOM en la plantilla y actualizar dinámicamente la vista en función de los cambios en los datos. Cada directiva tiene su propia función específica, lo que le permite definir la interacción y la lógica de su página de forma declarativa. Puede utilizar estas directivas en plantillas según sea necesario para crear potentes aplicaciones Vue.js.

¿Qué es Vuex? ¿Qué hace? Describa la estructura básica de una aplicación Vuex.

Vuex es una biblioteca de gestión estatal desarrollada específicamente para aplicaciones Vue.js. Se utiliza principalmente para gestionar el estado compartido (como datos, estado, información de configuración, etc.) en aplicaciones Vue.js para organizar, mantener y rastrear mejor el flujo de datos en la aplicación. La idea central de Vuex es almacenar centralmente el estado de la aplicación en un almacén global, haciendo que los cambios de estado sean predecibles y mantenibles.

Las principales funciones de Vuex incluyen:

  1. Gestión de estado centralizada: Vuex permite almacenar el estado de una aplicación en un único lugar, llamado tienda. Esta tienda es un árbol de estado receptivo. Varios componentes pueden compartir y acceder a este estado sin pasar datos a través de accesorios.

  2. Se pueden rastrear los cambios de estado: Vuex utiliza un estricto mecanismo de seguimiento de cambios de estado. Cada vez que cambia el estado, habrá registros y registros claros para facilitar a los desarrolladores el seguimiento y la depuración de las aplicaciones.

  3. Comunicación de componentes: Vuex proporciona una forma unificada de gestionar la comunicación entre componentes. Los componentes pueden modificar el estado enviando mutaciones y también pueden desencadenar operaciones asincrónicas enviando acciones, y estas operaciones son predecibles y controlables.

  4. Middleware: Vuex admite middleware, que puede realizar alguna lógica adicional cuando cambia el estado, como registro, persistencia de datos, etc.

Una aplicación Vuex básica normalmente incluye los siguientes componentes:

  • Estado: almacena los datos del estado de la aplicación, generalmente un objeto JavaScript.

  • Mutaciones: Métodos utilizados para modificar el estado. Cada mutación tiene un tipo y una función de controlador que realiza la operación de modificación del estado real.

  • Acciones: Similar a las mutaciones, pero puede contener operaciones asincrónicas, generalmente utilizadas para manejar la interacción con el servidor, adquisición de datos, etc. Las acciones se encargan de presentar mutaciones para modificar el estado.

  • Getters (propiedades calculadas): se utilizan para derivar algunos datos nuevos del estado, similares a las propiedades calculadas, y los componentes pueden usarlos directamente.

  • Tienda: un objeto que gestiona centralmente estados, mutaciones, acciones y captadores, es el núcleo de Vuex.

A continuación se muestra un ejemplo de la estructura básica de una aplicación Vuex simple:

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

const store = new Vuex.Store({
    
    
  state: {
    
    
    count: 0
  },
  mutations: {
    
    
    increment(state) {
    
    
      state.count++
    },
    decrement(state) {
    
    
      state.count--
    }
  },
  actions: {
    
    
    incrementAsync(context) {
    
    
      setTimeout(() => {
    
    
        context.commit('increment')
      }, 1000)
    }
  },
  getters: {
    
    
    doubleCount(state) {
    
    
      return state.count * 2
    }
  }
})

export default store

En el ejemplo anterior, definimos una tienda Vuex que contiene estados, mutaciones, acciones y propiedades calculadas. Se puede hacer referencia a esta tienda en los componentes de Vue y se utiliza para administrar y manipular el estado de la aplicación. El uso de Vuex puede simplificar enormemente la gestión del estado y la comunicación de componentes, especialmente en aplicaciones grandes.

¿Qué es el enrutador Vue? ¿Qué hace? Describa el uso básico de Vue Router.

Vue Router es la biblioteca oficial de administración de enrutamiento de Vue.js, que se utiliza para crear aplicaciones de una sola página (SPA). Le permite implementar navegación entre páginas, saltos de enrutamiento y administración de URL en aplicaciones Vue. La función principal de Vue Router es asociar diferentes componentes de vista con diferentes rutas (direcciones URL) de la aplicación para lograr el cambio y la navegación entre páginas.

El uso básico de Vue Router incluye los siguientes pasos:

  1. Instale Vue Router: Primero, instale Vue Router en su proyecto Vue.js. Puedes instalarlo usando npm o hilo:

    npm install vue-router
# 或者
yarn add vue-router

  2. Cree una configuración de enrutamiento: cree un archivo de configuración de enrutamiento en su proyecto, generalmente llamado router.jse importe Vue y Vue Router:

    import Vue from 'vue'
import VueRouter from 'vue-router'

Vue.use(VueRouter)

const routes = [
  {
      
      
    path: '/',         // 路由路径
    component: Home    // 对应的视图组件
  },
  {
      
      
    path: '/about',
    component: About
  }
  // 其他路由配置
]

const router = new VueRouter({
      
      
  routes // 使用配置文件中的路由规则
})

export default router

  3. Crear componentes de vista: cree los componentes de vista correspondientes para cada ruta de enrutamiento. Estos componentes pueden ser componentes normales de Vue como Home.vuey About.vue.

  4. Usando el enrutador en el componente raíz: use el enrutador Vue en la instancia raíz de Vue, generalmente en main.js:

    import Vue from 'vue'
import App from './App.vue'
import router from './router' // 导入路由配置

new Vue({
      
      
  el: '#app',
  router, // 使用路由配置
  render: h => h(App)
})

  5. Usar <router-link>y <router-view>: use la etiqueta en la plantilla <router-link>para crear enlaces de navegación y use <router-view>la etiqueta para representar el componente de vista de la ruta actual. Por ejemplo:

    <template>
  <div>
    <router-link to="/">Home</router-link>
    <router-link to="/about">About</router-link>
    
    <router-view></router-view>
  </div>
</template>

  6. Navegación y salto de ruta: puede usarlo <router-link>para implementar la navegación de ruta, o puede usar el método en el componente this.$router.push()para realizar un salto de ruta programático.

Estos son los métodos de uso básicos de Vue Router. Le permite implementar fácilmente la navegación y el cambio de ruta entre páginas en su aplicación Vue.js, lo que hace que el desarrollo de aplicaciones de una sola página sea más conveniente y fácil de mantener. Al definir configuraciones de ruta y asociar componentes de vista, puede crear aplicaciones enriquecidas de una sola página y asociar diferentes componentes de vista con diferentes rutas URL.

¿Cuál es la diferencia entre Vue2 y Vue3?

Existen algunas diferencias y mejoras importantes entre Vue.js 2 y Vue.js 3. Estas son algunas de las principales diferencias y características:

  1. Optimización del rendimiento:

    • Vue 3 ha realizado muchas optimizaciones de rendimiento internas, incluidas actualizaciones del DOM virtual, haciéndolo más rápido y eficiente.
    • Vue 3 introduce estrategias de optimización como carga diferida (Lazy Loading) y elevación estática (Static Hoisting) para mejorar aún más el rendimiento.

  2. API de composición:

    • Vue 3 presenta la API de composición, una API basada en funciones que permite una organización y reutilización más flexible de la lógica de los componentes.
    • La API de composición permite a los desarrolladores dividir el código por función, mejorando la legibilidad y el mantenimiento del código.

  3. Tamaño de paquete más pequeño:

    • La biblioteca principal de Vue 3 es más pequeña y, por lo tanto, se carga más rápido.
    • Vue 3 admite la carga bajo demanda, lo que permite introducir solo las funciones requeridas, lo que reduce aún más el tamaño del paquete.

  4. Teletransportarse:

    • Vue 3 introdujo Teleport, que permite representar el contenido de los componentes en cualquier ubicación del DOM, lo cual es muy útil para manejar cuadros modales, menús emergentes y otros escenarios.

  5. Fragmentos:

    • Vue 3 admite Fragmentos, lo que permite que los componentes devuelvan múltiples elementos raíz sin la necesidad de elementos contenedores adicionales.

  6. Modificaciones globales de API:

    • Vue 3 ha realizado algunos cambios en la API global para hacerla más consistente con los estándares modernos de JavaScript.
    • Por ejemplo, Vue.componentahora cambiar a app.component, Vue.directivecambiar a app.directive, Vue.mixincambiar a app.mixin.

  7. Nuevos ganchos de ciclo de vida:

    • Vue 3 introduce nuevos ganchos de ciclo de vida como onBeforeMounty onBeforeUpdatepara proporcionar un control más preciso y mejores oportunidades de optimización del rendimiento.

  8. Mejoras en la compatibilidad con TypeScript:

    • Vue 3 tiene soporte más completo para TypeScript y proporciona una mejor inferencia y verificación de tipos.

  9. Mejoras en los sistemas responsivos:

    • Vue 3 mejora el sistema de respuesta, proporciona una mejor compatibilidad con TypeScript y es más eficiente.

En general, Vue.js 3 tiene mejoras significativas en rendimiento, experiencia de desarrollo y mantenibilidad. Sin embargo, Vue 2 sigue siendo una versión estable con un amplio ecosistema y soporte, y los desarrolladores pueden elegir qué versión usar según las necesidades del proyecto. Si está iniciando un nuevo proyecto, Vue 3 puede ser una mejor opción debido a sus numerosas ventajas y mejoras. Si mantiene un proyecto de Vue 2, también puede considerar migrar gradualmente a Vue 3 para obtener mejoras en el rendimiento y la experiencia de desarrollo.

¿Puedes enumerar algunas características nuevas en Vue3?

A continuación se muestran algunas características nuevas y mejoras importantes en Vue.js 3:

  1. API de composición: La API de composición es una de las características nuevas más sorprendentes de Vue 3. Le permite dividir el código por función y organizar la lógica del código relacionado en conjunto, mejorando la capacidad de mantenimiento y la reutilización del código.

  2. Teletransporte: Teletransporte es una nueva característica que le permite renderizar el contenido de un componente a otras ubicaciones en el DOM. Esto es útil para crear componentes como modales, menús emergentes, etc.

  3. Fragmentos: Vue 3 admite Fragmentos, lo que permite que un componente devuelva múltiples elementos raíz sin la necesidad de elementos contenedores envolventes adicionales.

  4. Modificaciones a la API global: Vue 3 ha realizado algunas modificaciones a la API global para hacerla más consistente con los estándares modernos de JavaScript. Por ejemplo, Vue.componentahora cambie a app.component.

  5. Optimización del rendimiento: Vue 3 ha realizado muchas optimizaciones de rendimiento en el nivel inferior, incluida la actualización del DOM virtual, la carga diferida, la promoción estática y otras estrategias para hacer que la aplicación sea más rápida y eficiente.

  6. Mejoras en el sistema responsivo: Vue 3 ha mejorado el sistema responsivo, proporcionando una mejor compatibilidad con TypeScript y un seguimiento de datos responsivo más eficiente.

  7. Compatibilidad con TypeScript: Vue 3 tiene un soporte más completo para TypeScript, lo que proporciona una mejor inferencia y verificación de tipos.

  8. Tamaño de paquete más pequeño: la biblioteca principal de Vue 3 es más pequeña, se carga más rápido y admite la carga bajo demanda, lo que reduce el tamaño del paquete.

  9. Mejoras en los enlaces del ciclo de vida: Vue 3 introduce nuevos enlaces del ciclo de vida, como onBeforeMounty onBeforeUpdate, que brindan un control más preciso y oportunidades para la optimización del rendimiento.

  10. Suspense: Vue 3 admite la función Suspense, que le permite manejar el estado de carga de componentes asincrónicos con elegancia y brindar una mejor experiencia de usuario.

  11. Renderizadores personalizados: Vue 3 le permite crear renderizadores personalizados, lo que le permite usar Vue en diferentes entornos de destino, como renderizado del lado del servidor (SSR) o aplicaciones nativas.

  12. Mejoras en V-model: Vue 3 mejora la sintaxis de v-model, haciéndolo más flexible y puede usarse para el enlace bidireccional de componentes personalizados.

Estas nuevas características y mejoras hacen de Vue.js 3 un marco de interfaz de usuario más potente, eficiente y flexible, que ayuda a los desarrolladores a crear mejores aplicaciones e interfaces de usuario de una sola página.

Explique qué es la API de composición y cuáles son sus ventajas.

La API de composición es un nuevo método de organización de componentes introducido en Vue.js 3. Le permite dividir y organizar la lógica del código de los componentes por función. Este es un estilo de API basado en funciones, a diferencia de la API de Opciones tradicional, sus principales ventajas incluyen:

  1. Organización de código más flexible: la API de composición le permite dividir la lógica del código de un componente en múltiples partes funcionalmente relacionadas, cada parte es una función independiente. Esto hace que el código sea más claro y más fácil de mantener y probar. Puede reutilizar la lógica del código más fácilmente y aplicarla a múltiples componentes.

  2. Mejor inferencia de tipos: cuando se utiliza la API de composición con TypeScript,

¿Qué optimizaciones de rendimiento hay en Vue 3?

Vue 3 presenta muchas características nuevas y mejoras en la optimización del rendimiento para mejorar el rendimiento de sus aplicaciones. Aquí hay algunas medidas de optimización del rendimiento en Vue 3:

  1. Reescritura de DOM virtual : la implementación de DOM virtual de Vue 3 se ha reescrito para hacerla más rápida y ligera. Esto significa un mayor rendimiento de renderizado y actualización.

  2. Promoción de árbol estático : Vue 3 puede detectar subárboles estáticos y promoverlos a vnodes estáticos para evitar operaciones innecesarias de comparación y renderizado.

  3. Carga lenta : Vue 3 admite la carga lenta, que solo representa subcomponentes cuando es necesario, lo que reduce la carga de la renderización inicial.

  4. Mejor procesamiento de eventos : Vue 3 adopta un método de procesamiento y escucha de eventos más eficiente para mejorar el rendimiento del procesamiento de eventos.

  5. Optimización del compilador : el compilador de plantillas de Vue 3 se ha optimizado para generar funciones de renderizado más eficientes y reducir la sobrecarga del tiempo de ejecución.

  6. Fragment and Teleport : Vue 3 introdujo Fragment y Teleport, estas características pueden ayudarlo a organizar sus componentes de manera más efectiva y reducir los nodos de anidamiento y renderizado innecesarios.

  7. Suspense : la función Suspense en Vue 3 le permite mostrar marcadores de posición cuando se carga un componente asincrónico, lo que ayuda a mejorar la experiencia del usuario y al mismo tiempo reduce la representación innecesaria.

  8. Sistema reactivo reescrito : el sistema reactivo de Vue 3 se ha reescrito para hacerlo más rápido y escalable. Utiliza un proxy Proxy, que es más eficiente que Object.defineProperty de Vue 2.

  9. API de composición : Vue 3 presenta la API de composición, que le permite organizar y reutilizar el código de manera más flexible, lo que ayuda a mejorar el rendimiento y la capacidad de mantenimiento del código.

  10. Tree-Shaking : dado que Vue 3 usa módulos ES para organizar el código, las herramientas de compilación como Webpack pueden realizar Tree-Shaking más fácilmente, incluyendo solo el código realmente utilizado por la aplicación, lo que reduce el tamaño del paquete.

Estas medidas de optimización del rendimiento hacen de Vue 3 un marco de interfaz de usuario más rápido y eficiente, lo que ayuda a crear aplicaciones web más fluidas y con mayor capacidad de respuesta. Pero tenga en cuenta que la optimización del rendimiento también depende de su aplicación y uso específicos, por lo que en proyectos reales, es posible que necesite más análisis y ajustes de rendimiento.

¿Qué son los teletransportes y los fragmentos y cuáles son sus funciones en Vue 3?

En Vue 3, Teleport y Fragments son dos características nuevas que se utilizan para mejorar la estructura de renderizado y el control de la posición de renderizado de los componentes, respectivamente. Esto es lo que hacen y cómo usarlos:

  1. Teletransporte :

    • Función : Teletransportar le permite representar el contenido de un componente en diferentes ubicaciones en la estructura DOM sin estar restringido por el componente principal. Esto es útil para manejar modales, cuadros de diálogo, mensajes de notificación, etc. que deben representarse en diferentes ubicaciones de la página.

    • Uso : puede usar el elemento en una plantilla <teleport>y toestablecer su atributo en un selector de destino para especificar en qué elemento DOM se debe representar el contenido. Por ejemplo:

      <template>
  <div>
    <button @click="showModal">Show Modal</button>
    <teleport to="#modal-container">
      <Modal v-if="isModalVisible" @close="closeModal" />
    </teleport>
  </div>
</template>

    En el ejemplo anterior, el contenido del componente modal se representará id="modal-container"dentro del elemento DOM en la página.

  2. Fragmentos :

    • Función : los fragmentos le permiten envolver varios elementos secundarios en un elemento principal sin introducir elementos DOM adicionales. Esto ayuda a reducir el anidamiento de la estructura DOM, haciendo que el código sea más claro y conciso.

    • Uso : puede utilizar <template>el elemento o la sintaxis especial proporcionada por Vue 3 v-fragmentpara crear un Fragmento. Por ejemplo:

      <template>
  <div>
    <p>Paragraph 1</p>
    <p>Paragraph 2</p>
    <v-fragment>
      <p>Paragraph 3</p>
      <p>Paragraph 4</p>
    </v-fragment>
  </div>
</template>

      En el ejemplo anterior, <v-fragment>se empaquetan dos elementos <p>, pero la estructura DOM renderizada final no contiene elementos principales adicionales.

Teleport y Fragments son dos herramientas poderosas en Vue 3. Ayudan a administrar la estructura de representación de los componentes de manera más flexible y clara, al tiempo que mejoran la legibilidad y el mantenimiento del código. Estas dos características son especialmente útiles cuando se trata de diseños complejos y componentes reutilizables.

¿Qué cambios se han realizado en la API global en Vue 3? ¿Cómo utilizar estas API modificadas?

Vue 3 ha realizado algunas modificaciones a la API global para proporcionar un mejor rendimiento y funcionalidad. Estos son algunos de los cambios principales y cómo utilizar estas API modificadas:

  1. Crea una instancia de Vue :

    • Antes de la modificación (Vue 2) : en Vue 2, puede new Vue()crear una instancia raíz de Vue usando .

    • Después de la modificación (Vue 3) : en Vue 3, puede utilizar createApp()para crear instancias de aplicaciones, por ejemplo:

      import {
        
         createApp } from 'vue';
const app = createApp(App);
app.mount('#app');

  2. Registro de componentes globales :

    • Antes de la modificación (Vue 2) : en Vue 2, puede utilizar Vue.component()componentes de registro global.

    • Después de la modificación (Vue 3) : en Vue 3, puede utilizar app.component()para registrar componentes globales, por ejemplo:

      app.component('my-component', MyComponent);

  3. Filtro :

    • Antes de la modificación (Vue 2) : Vue 2 admite filtros, pero el concepto de filtros se eliminó en Vue 3. Puede utilizar propiedades o métodos calculados para reemplazar la funcionalidad de los filtros.

  4. Mezclas :

    • Antes de la modificación (Vue 2) : en Vue 2, puede usar mixinsopciones para mezclar opciones de componentes.

    • Después de la modificación (Vue 3) : en Vue 3, puede usar mixfunciones para lograr funciones similares, por ejemplo:

      import {
        
         defineComponent, ref, mix } from 'vue';

const mixin = {
        
        
  data() {
        
        
    return {
        
        
      message: 'Hello from mixin'
    };
  }
};

const MyComponent = defineComponent({
        
        
  mixins: [mixin],
  setup() {
        
        
    const count = ref(0);
    return {
        
        
      count
    };
  },
  template: `
    <div>
      {
         
         { message }}
      {
         
         { count }}
    </div>
  `
});

  5. Instrucciones personalizadas :

    • Antes de la modificación (Vue 2) : en Vue 2, puede utilizar Vue.directive()para registrar directivas personalizadas globales.

    • Después de la modificación (Vue 3) : en Vue 3, puede utilizar para app.directive()registrar directivas personalizadas globales, por ejemplo:

      app.directive('my-directive', {
        
        
  // 自定义指令的定义
});

Estos son algunos de los principales cambios globales de API. En Vue 3, la API global se usa de manera un poco diferente que en Vue 2, por lo que debe prestar atención a estos cambios al migrar su proyecto o escribir nuevo código de Vue 3. Debe utilizar la nueva API caso por caso para garantizar que su aplicación pueda aprovechar al máximo la funcionalidad y los beneficios de rendimiento de Vue 3.

Explique cómo funciona el sistema reactivo en Vue 3.

Una de las características principales de Vue 3 es su sistema reactivo, que le permite sincronizar automáticamente datos y vistas en su aplicación. Aquí hay una breve explicación de cómo funciona el sistema reactivo en Vue 3:

  1. Inicialización :

    • Cuando crea un componente o aplicación de Vue 3, Vue inicializa una instancia del sistema reactivo.

  2. Definición de datos :

    • Los datos reactivos se setupcrean en la función del componente. Esto se puede lograr con ref, reactiveo .computed

  3. Seguimiento de la dependencia de datos :

    • Cuando se procesa un componente, Vue rastrea automáticamente las dependencias de las propiedades de los datos. Esto significa que Vue sabe qué propiedades de datos se utilizan para representar la vista.

  4. Colección de dependencia reactiva :

    • Vue recopilará las dependencias de las propiedades de los datos durante la representación del componente y creará un gráfico de dependencia.

  5. Se activa cuando los datos cambian :

    • Cuando una propiedad de datos reactiva cambia, Vue notifica a las vistas que dependen de esa propiedad de datos para actualizarse.

  6. Actualización por lotes :

    • Vue 3 enviará notificaciones por lotes de múltiples cambios de datos para minimizar las operaciones de actualización de DOM y mejorar el rendimiento.

  7. Cola de actualización asincrónica :

    • Vue 3 utiliza colas de microtareas (como Promiseo nextTick) para manejar las actualizaciones de datos, lo que garantiza que múltiples cambios de datos en el mismo bucle de eventos solo activen una actualización de vista.

  8. Ver actualización :

    • Una vez que los cambios de datos se notifiquen a la vista, Vue 3 volverá a representar los componentes relevantes para mantenerlos sincronizados con los datos más recientes.

  9. Propiedades calculadas y oyentes :

    • Vue 3 le permite utilizar propiedades calculadas ( computed) y oyentes ( watch) para manejar la derivación de datos y escuchar cambios. Estas características también dependen de sistemas reactivos para funcionar.

En general, el sistema responsivo de Vue 3 logra la sincronización automática entre datos y vistas a través del seguimiento de la dependencia de datos y mecanismos de actualización automática de vistas. Esto permite a los desarrolladores centrarse más en el procesamiento de datos sin tener que manipular manualmente el DOM, lo que mejora la eficiencia del desarrollo y mejora la capacidad de mantenimiento del código.

¿Cuál es la diferencia entre Ref y Reactivo?

refy reactiveson dos formas diferentes de crear datos reactivos en Vue 3, y tienen algunas diferencias importantes:

  1. Tipo de referencia :

    • ref: refSe utiliza para crear datos de respuesta únicos. Envuelve un valor de JavaScript normal (como un número, una cadena, etc.) en un .valueobjeto con propiedades, lo que lo convierte en datos receptivos.
    • reactive: reactiveSe utiliza para crear un objeto responsivo que contiene múltiples propiedades. Acepta un objeto JavaScript normal y devuelve un objeto proxy receptivo, que puede convertir las propiedades del objeto en datos receptivos.

  2. Método de acceso :

    • ref: Puedes .valueacceder refa los valores a través de las propiedades. Por ejemplo: myRef.value.
    • reactive: Puede acceder directamente reactivea las propiedades dentro del objeto. Por ejemplo: myReactiveObj.someProperty.

  3. Propósito :

    • ref: generalmente se usa para encapsular tipos de datos básicos, como números, cadenas, valores booleanos, etc., o para encapsular .valuedatos que deben actualizarse mediante .
    • reactive: generalmente se usa para crear objetos de datos receptivos que contienen múltiples propiedades, como objetos de configuración complejos o estados de componentes.

  4. Ejemplo :

    • Úselo para refcrear datos reactivos:

      import {
        
         ref } from 'vue';

const count = ref(0); // 创建一个包装数字的 ref

    • Úselo para reactivecrear objetos reactivos:

      import {
        
         reactive } from 'vue';

const person = reactive({
        
        
  name: 'Alice',
  age: 30
}); // 创建一个包含多个属性的响应式对象

En general, refse usa para crear datos reactivos únicos y generalmente se usa para envolver tipos de datos básicos. Se reactiveutiliza para crear objetos reactivos que contienen múltiples propiedades, generalmente para la gestión de estructuras de datos complejas o estados de componentes. El método que elija utilizar depende de sus necesidades específicas y de su estructura de datos.

¿Qué mejoras se han realizado en la compatibilidad de Vue 3 con TypeScript? ¿Cómo utilizar TypeScript con Vue 3?

Vue 3 tiene muchas mejoras en su soporte para TypeScript, lo que hace que el desarrollo utilizando TypeScript y Vue 3 sea más fluido y seguro. A continuación se muestran algunas mejoras y pautas clave para usar TypeScript:

1. Inferencia de tipos y declaración de tipos :

  • Vue 3 proporciona una inferencia de tipos más potente, lo que le permite obtener una verificación de tipos más precisa.
  • Vue 3 viene con archivos de declaración TypeScript, por lo que no es necesario instalar archivos de declaración adicionales.

2. Componente de archivo único :

  • Las partes de componentes de un solo archivo (archivos .vue) <script>se pueden escribir usando TypeScript.
  • Puede agregar declaraciones de tipo a las partes del componente props, etc. para una mejor verificación de tipos data.methods

3. Proporcione más definiciones de tipos :

  • Vue 3 proporciona una gran cantidad de refdefiniciones de tipos, incluidas definiciones de tipos para ,,,,, y otras funciones.reactivecomputedwatchprovideinject

4. API de composición :

  • La API de composición de Vue 3 tiene un potente soporte para TypeScript, lo que facilita la escritura de lógica reutilizable.
  • defineComponentLos componentes con seguridad de tipos se pueden definir fácilmente mediante funciones.

5. Accesorios de tipo seguro :

  • En componentes, puede utilizar PropTypepara definir el tipo de accesorios.
  • Utilice las propiedades opcionales y los valores predeterminados de TypeScript para garantizar la seguridad de tipos de los accesorios.

6. Inferencia de tipos automatizada :

  • Vue 3 puede inferir automáticamente los tipos de muchas propiedades, lo que reduce la necesidad de agregar declaraciones de tipo manualmente.

7. Función de gancho de tipo seguro :

  • Vue 3 admite funciones de enlace de ciclo de vida con seguridad de tipos, como onMounted, onUpdatedetc.

8. Compatibilidad con el decorador TypeScript :

  • Vue 3 admite decoradores TypeScript, que se pueden utilizar para crear mixins, instrucciones personalizadas, etc.

9. Documentación enriquecida de TypeScript :

  • La documentación de Vue 3 proporciona una gran cantidad de ejemplos e instrucciones de TypeScript para ayudar a los desarrolladores a comprender mejor cómo usar TypeScript en Vue 3.

Directrices para utilizar TypeScript :

  1. Instale Vue 3: asegúrese de que Vue 3 y TypeScript estén instalados en su proyecto.
  2. Crear componentes: use .vuearchivos o API de composición para crear componentes. Puede agregar declaraciones de tipo para definir los accesorios y datos del componente.
  3. Aproveche la compatibilidad con el editor: utilice un editor que admita TypeScript (como VS Code) para una mejor verificación de tipos y autocompletado.
  4. Siga la documentación de Vue 3: consulte la documentación oficial de Vue 3, que tiene instrucciones detalladas y ejemplos sobre cómo usar TypeScript.

En general, Vue 3 proporciona un potente soporte para TypeScript, lo que hace que sea más fácil y confiable usar TypeScript en proyectos de Vue 3. Puede aprovechar estas funciones para mejorar la calidad del código, la capacidad de mantenimiento y la eficiencia del desarrollo.

Explique cómo crear directivas personalizadas y componentes personalizados en Vue 3.

Se han agregado algunas funciones nuevas de enlace del ciclo de vida a Vue 3 para ampliar la gestión del ciclo de vida y la lógica de los componentes. Estos son los nuevos ganchos del ciclo de vida y sus usos:

  1. antes de Mount (nuevo):

    • Propósito: Se llama antes de montar el componente. En esta etapa, el DOM virtual está preparado pero aún no se ha convertido en el DOM real. Se puede utilizar para realizar algunos trabajos de preparación.

  2. antes de la actualización (nuevo):

    • Propósito: Se llama antes de que se actualice el componente. En esta etapa, el DOM virtual se ha actualizado pero aún no se ha convertido en el DOM real. Se puede utilizar para realizar trabajos preparatorios antes de la actualización.

  3. actualizado (nuevo):

    • Propósito: Se llama después de que se actualiza el componente. En esta etapa, los datos del componente se han sincronizado en la vista. Se puede utilizar para realizar algunas operaciones relacionadas con el DOM actualizado.

  4. antes de desmontar (nuevo):

    • Propósito: Se llama antes de desinstalar el componente. En esta etapa, el componente todavía está completamente disponible. Se puede utilizar para realizar algunos trabajos de limpieza.

  5. desmontado (nuevo):

    • Propósito: Se llama después de desinstalar el componente. En esta etapa, todos los recursos del componente se han liberado y ya no están disponibles. Se puede utilizar para realizar algunos trabajos de limpieza finales.

Estas nuevas funciones de enlace del ciclo de vida se utilizan principalmente para una gestión del ciclo de vida más detallada, lo que le permite realizar operaciones específicas en diferentes etapas del ciclo de vida de los componentes. Por ejemplo, puede beforeMountrealizar algunas operaciones relacionadas con la preparación previa a la representación en ganchos o updatedrealizar algunas tareas relacionadas con operaciones DOM actualizadas en ganchos.

Además de los nuevos ganchos de ciclo de vida, Vue 3 aún admite otros ganchos de ciclo de vida en Vue 2 , como created,, etc. Estos ganchos del ciclo de vida le permiten gestionar los ciclos de vida de los componentes de manera más flexible para satisfacer diferentes necesidades.mountedbeforeDestroydestroyed

Supongo que te gusta

Origin blog.csdn.net/weixin_42439919/article/details/133065951
Recomendado
Clasificación
Diario
Más
2024-05-20(5)
2024-05-19(0)
2024-05-18(30)
2024-05-17(4)
2024-05-16(22)
2024-05-15(5)
2024-05-14(10)
2024-05-13(7)
2024-05-12(22)
2024-05-11(31)

Code World

© 2018 codetd.com