计算属性计算属性：计算出来的结果保存在属性中，内存中运行：虚拟DOM 情况一显示结果情况二显示结果情况三使用

计算属性：计算出来的结果保存在属性中，内存中运行：虚拟DOM

情况一

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<div id="app">
  <p>{{currentTime()}}</p>
</div>

<script src="https://cdn.bootcss.com/vue/2.5.2/vue.min.js"></script>
<script>
  var vue = new Vue({
    el:"#app",
    data:{
      message: "hello chen siyu"
    },
    methods:{
      currentTime: function (){
        return Date.now();//返回一个时间戳
      }
    }
  });
</script>
</body>
</html>

显示结果

情况二

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

显示结果

情况三使用computed

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<div id="app">
  <p>{{currentTime}}</p>
</div>

<script src="https://cdn.bootcss.com/vue/2.5.2/vue.min.js"></script>
<script>
  var vue = new Vue({
    el:"#app",
    data:{
      message: "hello chen siyu"
    },
    methods:{
      currentTime: function (){
        return Date.now();//返回一个时间戳
      },
      computed:{//计算属性   methods 和 computed中的方法名不能重名
          currentTime:function (){
            return Date.now() //返回一个时间戳
          }
      }
    }
  });
</script>
</body>
</html>