Vue.js入门

Vue.js入门

1. 编写一个Vue实例，将一个变量message绑定到一个HTML元素上，并在页面上显示出来。

html代码部分:

<div id="app">
  <p>{{ message }}</p>
</div>

Javascript部分：

var app = new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue.js!'
  }
});

2.编写一个Vue实例，将一个数组list绑定到一个HTML元素上，并使用v-for指令显示出来。
html:

<div id="app">
  <ul>
    <li v-for="item in list">{{ item }}</li>
  </ul>
</div>

JavaScript：

var app = new Vue({
  el: '#app',
  data: {
    list: ['item1', 'item2', 'item3']
  }
});