今天完成的事情

今天晚上才到学院继续上个阶段的任务，需要给导航栏中的各个列表加上路由。根据路由跳转的不同从而显示出不同的页面，在任务中仅需给article列表增加页面显示的路由就可以。因为需要给这个跳转做一个循环的路由，路径写在data的中。用v-for循环路由的过程，在这之前的几个列表不需要写出内容就可以设置跳转到主页面。

（1）html部分

实现循环对路由的配置核心：对路径的配置，红色部分。

<p v-for="(operate,path,index) in navTo.operate" class="nav" @click="change(index)">

<router-link :to="{ path: operate.path }">

   {{operate.name}}

</router-link>

<i class="el-icon-arrow-right right"></i>

</p>

（2）数据部分

      export default {

  name: 'HelloWorld',

  data () {

    return {

    navTo:{

    "operate":[

         {"name":"系统1","path":'/header'},

         {"name":"系统2","path":'/HelloWorld/engine'},

         {"name":"系统3","path":'/HelloWorld/engine'},

         {"name":"系统4","path":'/HelloWorld/engine'},

         {"name":"系统5","path":'/HelloWorld/engine'},

                 {"name":"系统6","path":'/HelloWorld/engine'},

                 {"name":"系统7","path":'/HelloWorld/engine'},

                 {"name":"系统8","path":'/HelloWorld/engine'},

                 {"name":"系统9","path":'/HelloWorld/engine'},

                 {"name":"系统10","path":'/HelloWorld/engine'}

      ]

    }

    }

  }

}

通过这个例子套用可以加在我们的列表项中。然后把样式格式改一下就会好很多。

明天要完成的事情

需要把列表项的静态页面大致写出来。看其中需要展示的内容是哪些部分