计算属性 computed:{ }

• 两份数据有依赖关系 （data中有数据，相应的计算机属性中有数据）
• 将字符串转换成数组spilt()
• 将数组咋混换成字符串join()

内部语法： 名字：function(){
               return 更新后的内容
             }

            <div>
                原数据：{{message}}
            </div>
            <div>
                反转之后的数据：{{reverseMessage}}
            </div>
---------------------------------------------------------------------------------------------------------------
        <script>
            let vm = new Vue({
                el:'#app',
                data:{
                    message:'ABCDEFG',
                    },
                // 计算属性
                computed:{
                    reverseMessage:function(){
                        // 将字符串转换成数组=>转换成字符串
                    return this.message.split('').reverse().join('');
                    },
                }
            });
        </script>

过滤器：filters:{ }

内部语法：名字：function(value){
                    逻辑语句
             }

            <div>
                {{data中的数据 | 方法名}}
            </div>

            <!-- 过滤器 -->
            <div>
                {{msg | toUpdateCase}}
            </div>
---------------------------------------------------------------------------------------------------------------
        <script>
            let vm = new Vue({
                el:'#app',
                data:{
                    msg:'abcDEFG',
                // 过滤器
                filters:{
                    toUpdateCase:function(value){
                        return value.toUpperCase();
                    },
                }
            });
        </script>

侦听器：watch:{ }

内部语法：名字：function(newValue,oldValue){ 
              逻辑语句
              }

            <div>
                请输入用户名：<input type="text" v-model="username"/>{{result}}
            </div>
---------------------------------------------------------------------------------------------------------------
        <script>
            let vm = new Vue({
                el:'#app',
                data:{
                    username:'',
                    result:'',
                // 侦听器
                watch:{
                    username:function(newVaule,oldValue){
                        if(this.username==''){
                            this.result='';
                        }else{
                        if(this.username.length==8){
                            this.result="正确";
                        }else{
                            this.result="错误";
                        }
                    }
                }
            },
            });
        </script>