Usuario:ManuelRomero/Vue

De WikiEducator
Saltar a: navegación, buscar
Cargar la librería en el fichero html y declarando variables reactivas


Icon activity.jpg
Hola Mundo
app.js
//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
html
<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