Diferencia entre revisiones de «Usuario:ManuelRomero/Vue»
De WikiEducator
Línea 1: | Línea 1: | ||
− | ;Cargar la librería en el fichero html | + | ;Cargar la librería en el fichero html y declarando variables reactivas |
{{MRM_Actividad|Title=Hola Mundo| | {{MRM_Actividad|Title=Hola Mundo| | ||
;app.js | ;app.js | ||
Línea 29: | Línea 29: | ||
</source> | </source> | ||
}} | }} | ||
+ | ;Incluir métodos en la instancia de vue |
Revisión de 04:25 10 oct 2020
- Cargar la librería en el fichero html y declarando variables reactivas
//Declaro una clase que será una instancia de Vue const app={ data(){//Aquí declaramos las variables que quiero hacer reactivas en la vista return{ mensaje :"Hola persona con mensaje 1", mensaje1 :"Otro Hola persona con mensaje 2", } } } Vue.createApp(app).mount("#app1"); //Monto el objeto como una app de vue con el id app1
<script src="https://unpkg.com/vue@next"></script> <!--En el id tengo que especificar el componente vue que he cargado--> <div id=app1> <!-- Aquí puedo referenciar las variables creadas en la funcińo data del objeto que instancia Vue --> {{mensaje}} {{mensaje1}} </div> <script src='app.js'></script> <!-- cargo el script debo hacerlo aquí, ya que el id y las variables han de estar disponibles en el DOM-->
|
- Incluir métodos en la instancia de vue