案例:Vue.js案例     状态:可编辑再运行    进入竖版
 运行结果 
x
 
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"  v-W3xue:hello.a.b="message">
10
</div>
11
12
<script>
13
Vue.directive('W3xue', {
14
  bind: function (el, binding, vnode) {
15
    var s = JSON.stringify
16
    el.innerHTML =
17
      'name: '       + s(binding.name) + '<br>' +
18
      'value: '      + s(binding.value) + '<br>' +
19
      'expression: ' + s(binding.expression) + '<br>' +
20
      'argument: '   + s(binding.arg) + '<br>' +
21
      'modifiers: '  + s(binding.modifiers) + '<br>' +
22
      'vnode keys: ' + Object.keys(vnode).join(', ')
23
  }
24
})
25
new Vue({
26
  el: '#app',
27
  data: {
28
    message: 'W3xue教程!'
29
  }
30
})
31
</script>
32
</body>
33
</html>