2020-03-24

Posted 2021-03-04

鏍囩锛?a href='http://www.mamicode.com/so/1/ber' title='ber'>ber   dex   child   let   RoCE   pre   tar   sea   index   

鎻忚堪

emmmm锛屼粖澶╂崲浜嗕竴涓Щ鍔ㄧ妗嗘灦瀛︿範锛寁ux瀹樼綉涓嶆敮鎸乿ue3.x锛岀櫨搴︿簡濂戒箙娌¤В鍐抽厤缃棶棰橈紝鎹簡涓€涓殏铓佺殑ui-vant銆?/p>

闅忕瑪

vant

瀹樻柟鏂囨。锛?a href="https://youzan.github.io/vant/#/zh-CN/quickstart">https://youzan.github.io/vant/#/zh-CN/quickstart

tabber 鎼缓

tabber.vue

<template>
    <div>
      <router-view/>
      <Tabbar
        v-model="active"
        active-color="#07c160"
        inactive-color="#000"
      >
        <TabbarItem icon="home-o" to="left">atd</TabbarItem>
        <TabbarItem icon="search" to="center">鏁欏姟</TabbarItem>
        <TabbarItem icon="friends-o" to="right">mi</TabbarItem>
      </Tabbar>
    </div>
</template>

<script>
import { Tabbar, TabbarItem } from 鈥榲ant鈥?export default {
  name: 鈥榯abber鈥?
  components: {
    Tabbar,
    TabbarItem
  },
  data () {
    return {
      active: 1
    }
  }
}
</script>

<style scoped>

</style>

<template>
    <div>right</div>
</template>

<script>
export default {
  name: 鈥榬ight鈥?}
</script>

<style scoped>

</style>

<template>
    <div>center</div>
</template>

<script>
export default {
  name: 鈥榗enter鈥?}
</script>

<style scoped>

</style>

<template>
    <div>right</div>
</template>

<script>
export default {
  name: 鈥榬ight鈥?}
</script>

<style scoped>

</style>

璺敱

import Vue from 鈥榲ue鈥?import VueRouter from 鈥榲ue-router鈥?import Index from 鈥?/../views/index鈥?import Test from 鈥?/../views/test鈥?import Letf from 鈥?/../components/left鈥?import Center from 鈥?/../components/center鈥?import Right from 鈥?/../components/right鈥?
Vue.use(VueRouter)

const routes = [
  {
    path: 鈥?鈥?
    component: Index,
    name: 鈥樹富椤碘€?
    children: [
      { path: 鈥榣eft鈥? component: Letf, name: 鈥榓td鈥?},
      { path: 鈥榗enter鈥? component: Center, name: 鈥樻暀鍔♀€?},
      { path: 鈥榬ight鈥? component: Right, name: 鈥榤i鈥?}
    ]
  },
  { path: 鈥?test鈥? component: Test, name: 鈥樻祴璇曢〉闈⑩€?}
]

const router = new VueRouter({
  mode: 鈥榟istory鈥?
  base: process.env.BASE_URL,
  routes
})

export default router