https://wikiprogramming.alfredgg.dev/ 2026-05-13T10:26:23+0000 https://wikiprogramming.alfredgg.dev/ https://wikiprogramming.alfredgg.dev/lib/tpl/dokuwiki/images/favicon.ico text/html 2020-05-09T09:25:10+0000 Anonymous (anonymous@undisclosed.example.com) https://wikiprogramming.alfredgg.dev/doku.php?id=wiki2:vue:basic&rev=1589016310&do=diff Basic usage of vue Vue CLI sudo npm install -g @vue/cli vue ui text/html 2020-05-09T09:25:10+0000 Anonymous (anonymous@undisclosed.example.com) https://wikiprogramming.alfredgg.dev/doku.php?id=wiki2:vue:js&rev=1589016310&do=diff Vue and JS Basic We can do this in html file (after this we should include our script): <vue-app>[[ message ]]</vue-app> new Vue({ el: 'vue-app', delimiters: ['[[', ']]'], data: { message: "Hello Vue! caca de la vaca!" } }); O con una inline template: text/html 2020-05-09T09:25:10+0000 Anonymous (anonymous@undisclosed.example.com) https://wikiprogramming.alfredgg.dev/doku.php?id=wiki2:vue:old&rev=1589016310&do=diff Vue2 Old Create a project $ vue init webpack vueapp01 Controller example <template> <div class="hello"> <h1>{{ msg }}</h1> <hr /> <div> <ul> <li v-for="user in users" :key="user.name"> {{user.firstname}} {{user.lastname}} </li> </ul> </div> <hr /> <div> <input type="text" v-model="input_val"> </div> <div> Input Value: <span v-text="input_val"></span> </div> <hr /> <div> <button class="btn b… text/html 2020-05-09T09:25:10+0000 Anonymous (anonymous@undisclosed.example.com) https://wikiprogramming.alfredgg.dev/doku.php?id=wiki2:vue:webcomponents&rev=1589016310&do=diff Web components UserWebComponent: <template> <div> <h1>My Vue Web Component</h1> <div>{{ msg }}</div> </div> </template> <script> export default { props: ['msg'] } </script> $ vue-cli-service build --target wc --name user-component --mode production ./src/UserComponent.vue