A partir du fichier html suivant :

<html>

    <head>

        <title>Ma page Vue.js</title>

    </head>

    <body>

        <div id="app">

            <img <!-- A compléter ici --> />

        </div>

        <script src="https://unpkg.com/vue@next"></script>

        <script src="./app.js"></script>

    </body>

</html>

Et du fichier app.js :

const vm = Vue.createApp({

    data() {

        return {

            // A compléter ici

        }

    }

}).mount('#app')

// mount spécifie que l'application Vue s'affichera dans la div avec id="app"

 

Effectuer les modifications pour produire l'affichage ci-dessous :

image

 

 

 

L'image ainsi que les fichiers index.html et app.js de départ sont fournis en ressources dans

\\prof\vue js\td1\ressources.