vuejs使用计算属性

Question

我是vue的新手并且一直在使用“计算属性”。我正在尝试排序日期。我每个条目有2个日期。 （在这一点上，如果我可以按最近更新排序以进行渲染 - 这将起作用。）我在v-for“item in sortedItems”中调用计算属性，但没有任何反应？谁能看到我在这里失踪的东西？

    <script type="text/javascript" src="https://unpkg.com/vue@2.0.3/dist/vue.js"></script>
    <script>
        new Vue({
            el: "#app",
            data: {
                items: [],
                Title: ""
            },
            created: function() {
                this.getData();

            },
            computed: {
                sortedItems: function() {
                    return this.items.sort((a, b) => new Date(a.date) - new Date(b.date))
                }

            },
            filters: {
                date: function(str) {
                    if (!str) {
                        return '(n/a)';
                    }
                    str = new Date(str);
                    return ((str.getMonth() < 9) ? '0' : '') + (str.getMonth() + 1) + '/' +
                        ((str.getDate() < 10) ? '0' : '') + str.getDate() + '/' + str.getFullYear();
                }



            },
            methods: {


                getData: function() {
                    var root = 'https://example.com';
                    var headers = {
                        accept: "application/json;odata=verbose"

                    }
                    var vm = this;

                    $.ajax({
                        url: root + "_api/web/lists/getbytitle('Issues')/items?&$orderby=Created desc",
                        type: 'Get',
                        headers: headers,
                        success: function(data) {
                            vm.items = data.d.results;
                            console.log(vm.items)
                        }

                    })
                }
            }
        })

    </script>

    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <link rel="stylesheet" href="https://unpkg.com/tachyons/css/tachyons.min.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    
    <div id="app">

        <div class="container">


            <div class="panel panel-default" v-for="item in sortedItems" v-if="item.status !=='complete'">
                <div class="panel-heading">Tracking ID#{{item.TrackingID}} <span class="pull-right"><small>last modified</small> {{item.Modified | date}} | <small>Created</small> {{item.Created | date}}</span></div>

            </div>





        </div>
    </div>