如何让 v-for 额外渲染的数据往下显示？ 目前这一段代码，当数据超过一屏后，点击 Show More，新的内容会把原来的内容往上撑，而不是往下

<div id="ttt" style="padding-bottom:100px;border: 1px solid green">
        <div v-for="(comment, index) in comments">
            <div>
                <p v-text="comment"></p>
            </div>

        </div>
        <button class="btn" @click="showMore">
            Show More
        </button>
    </div>

<script>
    new Vue({
        el: '#ttt',
        data: {
            comments: ['tom', 'jack' ,'lily'],
        },
        methods: {
            showMore() {
                        this.comments = this.comments.concat(['mary', 'jessica'])
                    }
        },
    });
    </script>