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>则是变化的页面,这种思路得学习一下;

猜你喜欢

转载自www.cnblogs.com/lanyb009/p/9231441.html