#

whycq

2022-08-17 4d66e520750f0ea35b33817849b7ee6a25053eb2

 pages/demo/index.vue

@@ -1,11 +1,76 @@
<template>
   <view>
      <view class="home-nav">
         <view class="home-nav-item" v-for="(item,index) in navs">
            <view class="nav-icon">
               <uni-icons :type="item.icon" size="60"></uni-icons>
            </view>
            <view class="nav-text">
               {{item.text}}
            </view>
      
         </view>
      </view>
   </view>
</template>

<script>
   export default{
      data() {
         return {
            navs:[
               {
                  text:'入库',
                  icon:'download'   ,
               },
               {
                  text:'出库',
                  icon:'upload'   ,
               },
               {
                  text:'盘点',
                  icon:'compose'   ,
               },
               {
                  text:'退出登录',
                  icon:'close'   ,
               },
               ]
         }
      },
      methods: {
			
      }
   }
</script>

<style>
   .home-nav {
      width: 100%;
   }
   .home-nav-item {
      width: 33.33%;
      height: 0;
      padding-bottom: 33.33%;
      margin-top: 1%;
      border-bottom: 1px solid #cbcbcb;
      border-right: 1px solid #cbcbcb;
      display: inline-block;
   }
   .home-nav-item:first-child {
		
   }
   .nav-icon {
      width: 60%;
      height: 0;
      padding-bottom: 60%;
      margin: 10% auto;
      text-align: center;
   }
   .nav-text {
      width: 100%;
      height: 0;
      margin-bottom: 20%;
      text-align: center;
   }
</style>