computed 计算属性

    <!-- 计计算属性 computed-->
    <div id="app14">
        {{ message }}
        {{ newMessage1 }}
        {{ newMessage() }}
    </div>


调用：
  StudyComputed("#app14")


实现：



//computed vs methods
//我们可以使用 methods 来替代 computed，
//效果上两个都是一样的，但是 computed 是基于它的依赖缓存，
//只有相关依赖发生改变时才会重新取值。而使用 methods ，在重新渲染的时候，函数总会重新调用执行。
function StudyComputed(obj) {
    new Vue({
        el: obj,
        data: {
            message:'zzzz'
        },
        computed: {              //可以说使用 computed 性能会更好，但是如果你不希望缓存，你可以使用 methods 属性。
            newMessage1: function () {
                return this.message+'hao'

            }
        },

        methods: {
            newMessage: function () {
                return this.message + 'hao'
            }
        }

    })


}