一段失败的代码，过滤排序，无法刷新页面，后续努力更新

<template>
    <div id="test">
            <ul>
                <li v-for="(p,index) in sortMe(sortY)" :key="index">
                    {{p.createTime}}--{{p.totalCount}}--{{p.type}}
                </li>                    
            </ul>
            
            <button @click="nostHost(1)">最新</button>
            <button @click="setOrderType(2)">最热</button>
            <button @click="setOrderType(0)">原本顺序</button>
            <button @click="setOrderType('A')">应用</button>
            <button @click="setOrderType('B')">原本顺序</button>
        </div>

</template>
<script type="text/javascript">
    export default {
            mounted() {
                
            },
            data(){
                return{
                    scrollData:[
                        {
                        type: "A",
                        totalCount: 2354,
                        createTime: "2018-12-1",
                        id: 1
                        },
                        {
                        type: "A",
                        totalCount: 586,
                        trade: "2",
                        createTime: "2018-12-7",
                        id: 2
                        },
                        {
                        type: "A",
                        totalCount: 983,
                        createTime: "2018-12-18",
                        id: 3
                        },
                        {
                        type: "B",
                        totalCount: 680,
                        createTime: "2018-12-2",
                        id: 1
                        }
                    ],
           orderType: 0, 
                    newVal:0
                }
            },
            computed:{
                 // filterPersons(){
                        //取出相关数据
                        // const {scrollData,orderType,newVal}=this 
                        
                        //最热排序
                        
                    // }
            },
            methods:{
                setOrderType(orderType){
                    // location.reload()
                    this.orderType=orderType
                    this.sortMe(sortY)
                },
                nostHost(newVal){
                    // location.reload()
                    this.newVal=newVal
                    this.sortMe(sortY)
                },
                sortMe:function(sortY){
                        if(this.orderType===2){
                            this.scrollData.sort(function(p1,p2){    //返回负数P1在前，返回正数P2在前
                                //1代表升序，2代表降序
                                    return p2.totalCount-p1.totalCount
                                // return p2.totalCount-p1.totalCount
                            })
                            return this.scrollData
                        }
                        // 最新
                    if(this.newVal===1){
                        this.scrollData.sort(function(p1,p2){   
                                return parseInt(p2.createTime.split('-').join(""))-parseInt(p1.createTime.split('-').join(""))
                            // return parseInt(p2.createTime.split('-').join(""))-parseInt(p1.createTime.split('-').join(""))
                        })
                        return this.scrollData
                    }
                        return this.scrollData
                }

            }
    }
</script>
<style scoped>
     body {
          font-family: Helvetica Neue, Arial, sans-serif;
          font-size: 14px;
          color: #444;
        }
 
        table {
          border: 2px solid #42b983;
          border-radius: 3px;
          background-color: #fff;
        }
 
        th {
          background-color: #42b983;
          color: rgba(255,255,255,0.66);
          cursor: pointer;
          -webkit-user-select: none;
          -moz-user-select: none;
          -user-select: none;
        }
 
        td {
          background-color: #f9f9f9;
        }
 
        th, td {
          min-width: 120px;
          padding: 10px 20px;
        }
 
        th.active {
          color: #fff;
        }
 
        th.active .arrow {
          opacity: 1;
        }
 
        .arrow {
          display: inline-block;
          vertical-align: middle;
          width: 0;
          height: 0;
          margin-left: 5px;
          opacity: 0.66;
        }
 
        .arrow.asc {
          border-left: 4px solid transparent;
          border-right: 4px solid transparent;
          border-bottom: 4px solid #fff;
        }
 
        .arrow.dsc {
          border-left: 4px solid transparent;
          border-right: 4px solid transparent;
          border-top: 4px solid #fff;
        }
</style>