vue构造器的内容 

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Vue 学习</title>
    <script src="vue.js"></script>
</head>
<body>

<div id="app">
  <p>{{ print_message() }}</p>
  <p>{{ say_name() }}</p>
  <p>{{ age }}</p>
</div>

<script>
    var data = { message: 'Hello Vue.js!', name: 'rao', age: 19 } //data的所有属性都会响应式地添加到app中的data，即使没有的属性
    var app = new Vue({
      el: '#app',
      data: data,
      methods: {
          print_message: function(){
              return this.message;
          },
          say_name: function(){
              return this.name;
          }
      }
    });
    document.write(data.fuck === app.fuck) //true
    document.write(app.name); //data的属性这样引用
    document.write(app.$el === document.getElementById('app')); //实例属性前要加$
    document.write(app.$data === data); //实例属性前要加$
</script>
</body>
</html>

 

posted @ 2018-03-22 21:52  volcanorao  阅读(126)  评论(0)    收藏  举报