vue——8-vue计算属性

计算属性：是基于它们的依赖进行缓存的。只在相关依赖发生改变时它们
才会重新求值。这就意味着只要 message 还没有发生改变，多次访问
计算属性会立即返回之前的计算结果，而不必再次执行函数

函数方法：每当触发重新渲染时，调用方法将总会再次执行函数

综上：
计算属性 适合较大量计算和改变频率较低的属性，性能更好
函数方法 适合改变频率高和不需要缓存的属性

<div id="enjoy">
    <p>初始值：{{msg}}</p>
    <p>翻转值（法一:数据）：{{msg.split('').reverse().join('')}}</p>
    <p>翻转值（法二:函数）：{{reverseStr()}}</p>
    <!--计算属性后面不加括号-->
    <p>翻转值（法三:计算属性）：{{reverse}}</p>
</div>

        {
            new Vue({
                el:'#enjoy',
                data:{
                    msg:'hello!'
                },
                methods:{
                    reverseStr(){
                       return this.msg.split('').reverse().join('');
                    }
                },
                computed:{//计算选项
                    //get方法
                    reverse(){
                        return this.msg.split('').reverse().join('');
                    }
                }
            })
        }