vue中页面设计技巧1

 1 <template>
 2   <div>
 3       <router-link :to="{path: '/'}" class="head-logo">
 4         <img src="./assets/logo.png">
 5       </router-link>
 6       <div class="head-nav">
 7         <ul class="nav-list">
 8           <li @click="showDialog('isShowLogin')">登录</li>
 9           <li class="nav-pile">|</li>
10           <li @click="showDialog('isShowReg')">注册</li>
11           <li class="nav-pile">|</li>
12           <li @click="showDialog('isShowAbout')">关于</li>
13         </ul>
14       </div>
15     <div class="container">
16       <keep-alive>
17         <router-view></router-view>
18       </keep-alive>
19     </div>

在container上面是页面的公用部分,而后面采用<router-view>则是变化的页面,这种思路得学习一下;

posted @ 2018-06-26 21:58  追风筝的蜗牛  阅读(1825)  评论(0)    收藏  举报