Vue for循环后的router-link中的to不能被正常跳转

接着上一篇的内容，使用循环来完成router-link的生成，并可以实现界面的路由。

（1）HTML部分

<div
    v-for="(item, index) of list"
    :key="index"
>
    <router-link
        :to="{ path: item.url }"
        tag="div"
        class="item border-bottom"
    >
        <span class="iconfont item-img">{{item.img}}</span>
        {{item.title}}
    </router-link>
</div>

实现循环对路由的配置核心：对路径的配置     :to="{ path: item.url }"

（2）逻辑部分

data () {
    return {
        list: [{
            title: '我的学习',
            img: '\ue801',
            url: '/study/mylist'
        }, {
            title: '学习历史',
            img: '\ue62e',
            url: '/study/mylist'
        }, {
            title: '我的考试',
            img: '\ue602',
            url: '/study/mylist'
        }, {
            title: '考试成绩',
            img: '\ue6ab',
            url: '/study/mylist'
        }]
    }
}