编程知识 cdmana.com

Vue learning process of back end dog (1)

Catalog
  • demo The three part structure of
  • Judge :v-if、v-else-if、v-else
  • loop :v-for
  • Event binding v-on:eventType
  • Two way binding of content input v-model

Source code :Github

demo The three part structure of
  • adopt script src introduce ``vue relevant js` file
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
  • stay body Medium div Pass through id binding ``vue` object
<div id="app"> <!-- message output --> <h1>{{message}}</h1></div>
  • stay js The binding of objects is implemented in the code , initialize value 、 Member functions and other hook functions that may exist in the life cycle .
<script> var vm = new Vue({  el: "#app",  data: {   message: "hello Vue",   ok: true,   items: [{    value: "List item 1"   }, {    value: "List item 2"   }, {    value: "List item 3"   }],   username: "",   input2: "",  },  methods: {   clickButton: function() {    this.message = "button clicked ... ";    this.ok = false;   }  }, })</script&.........

版权声明
本文为[Irving the procedural ape]所创,转载请带上原文链接,感谢

Scroll to Top