Constructor de Vue: extensión y carga manual $mount

Referencia: Lección 8-9 del folleto de Nuggets "Una breve introducción a los componentes de Vue"

I. Escenarios de uso

1. Características del uso de componentes convencionales:

2. Los componentes normales solo pueden representar componentes en ubicaciones específicas. Hay más restricciones en algunos escenarios especiales, como:

Uso

Al crear una instancia de Vue, Vue.extend. Se basa en el constructor de Vue y crea una subclase. Sus parámetros son básicamente los mismos que los del nuevo Vue, pero los datos deben ser los mismos que los del componente. Es una función y el componente se puede renderizar y montar con $mount.

Para lograr el mismo efecto, además de usar extender, también puede crear directamente una instancia de Vue y usar la función Render para renderizar un componente .vue. Esto le permitirá escribir componentes complejos en .vue y pasar los accesorios apropiados según sea necesario.

Tenga en cuenta que los componentes renderizados manualmente usando mount deben destruirse destruyendo manualmente la instancia usando $destroy. Si es necesario, puede utilizar removeChild para eliminar el nodo del DOM.

III. Práctica 1: Cómo renderizar dinámicamente componentes de un archivo .vue

1. Diseño de interfaz: un archivo .vue normal contiene 3 partes: plantilla, script y estilo. Cuando se usa extender para construir una instancia de componente, sus opciones corresponden a la sección