案例:Vue.js案例     状态:可编辑再运行    进入竖版
 运行结果 
AخA
 
1
<!DOCTYPE html>
2
<html>
3
<head>
4
<meta charset="utf-8">
5
<title>Vue 测试实例 - W3xue教程(w3xue.com)</title>
6
<script src="//unpkg.com/vue/dist/vue.js"></script>
7
</head>
8
<body>
9
<div id="app">
10
    <p>{{ message }}</p>
11
    <button v-on:click="reverseMessage">反转字符串</button>
12
</div>
13
    
14
<script>
15
new Vue({
16
  el: '#app',
17
  data: {
18
    message: 'W3xue!'
19
  },
20
  methods: {
21
    reverseMessage: function () {
22
      this.message = this.message.split('').reverse().join('')
23
    }
24
  }
25
})
26
</script>
27
</body>
28
</html>