前言：前端框架千千万，独有vue占一半
我是风尚，让我们一起坐火箭去学习Vue
第六章：用Vue计算属性实现翻转功能
上章回顾：?学会了吗风尚？好好看，一会多写几遍，一定得学会！
“学会了，谢谢师傅，原来Vue这么有趣啊，师傅再来一个吧”风尚一脸期待的说道。
来吧，今天再教你个Vue的计算属性：
Vue计算属性：模板内的表达式非常便利，但是设计它们的初衷是用于简单运算的。在模板中放入太多的逻辑会让模板过重且难以维护。例如：
<div?id="example">
??{{ msg.split('').reverse().join('') }}
</div>当你需要从现有数组得到新的数据这个时候你就需要计算了computed，这里是想要显示变量 msg 的翻转字符串。当你想要在模板中多次引用此处的翻转字符串时，就会更加难以处理。
<div?id="example">
??<p>原来的信息: "{{ msg }}"</p>
??<p>计算翻转的信息: "{{ rmsg }}"</p>
</div>var vm = new Vue({
??el: '#example',
??data: {
????msg: 'Hello'
??},
??computed: {
????// 计算属性的 getter
????rmsg: function () {
????// `this` 指向 vm 实例
????return this.msg.split('').reverse().join('')
????}
??}
})结果：
原来的信息: "hello"
计算翻转的信息: "olleh"
这样用Vue计算属性实现翻转功能实现！
一会儿教你用Vue计算属性实现数据筛选功能，别站着快去练习两遍！