张延森 3 年 前
コミット
18c50aaf96
共有6 個のファイルを変更した43 個の追加1 個の削除を含む
  1. 12
    1
      src/pages/index/index.jsx
  2. 3
    0
      src/pages/index/index.less
  3. 7
    0
      src/pages/index/tabs/Guide.jsx
  4. 7
    0
      src/pages/index/tabs/Mine.jsx
  5. 7
    0
      src/pages/index/tabs/Recommend.jsx
  6. 7
    0
      src/pages/index/tabs/Strategy.jsx

+ 12
- 1
src/pages/index/index.jsx ファイルの表示

@@ -1,10 +1,15 @@
1
-import React, { useState } from 'react'
1
+import React, { Suspense, useState, lazy } from 'react'
2 2
 import { View, Text } from '@tarojs/components'
3 3
 import CustomNav from '@/components/CustomNav'
4 4
 import logo from '@/assets/icons/comm/logo_small.png'
5 5
 import tabList from './tabbar'
6 6
 import './index.less'
7 7
 
8
+const Recommend = lazy(() => import('./tabs/Recommend'))
9
+const Guide = lazy(() => import('./tabs/Guide'))
10
+const Strategy = lazy(() => import('./tabs/Strategy'))
11
+const Mine = lazy(() => import('./tabs/Mine'))
12
+
8 13
 export default (props) => {
9 14
   const [currentTab, setCurrentTab] = useState(0)
10 15
 
@@ -19,6 +24,12 @@ export default (props) => {
19 24
         <CustomNav logo={logo} title='首页' />
20 25
       </view>
21 26
       <view className='index-container'>
27
+        <Suspense fallback='loading...'>
28
+          {currentTab === 0 && <Recommend />}
29
+          {currentTab === 1 && <Guide />}
30
+          {currentTab === 2 && <Strategy />}
31
+          {currentTab === 3 && <Mine />}
32
+        </Suspense>
22 33
       </view>
23 34
       <view className='index-tabbar'>
24 35
         <mp-tabbar extClass='custom-tabbar' current={currentTab} list={tabList} onChange={handleTabChange}></mp-tabbar>

+ 3
- 0
src/pages/index/index.less ファイルの表示

@@ -20,6 +20,9 @@
20 20
 }
21 21
 
22 22
 .custom-tabbar {
23
+  background: #FFFFFF;
24
+  box-shadow: 0px -4px 6px 0px rgba(0, 0, 0, 0.08);
25
+
23 26
   .weui-tabbar__label {
24 27
     color: #C0C8D3;
25 28
   }

+ 7
- 0
src/pages/index/tabs/Guide.jsx ファイルの表示

@@ -0,0 +1,7 @@
1
+import React from 'react'
2
+
3
+export default (props) => {
4
+  return (
5
+    <view>入住指引</view>
6
+  )
7
+}

+ 7
- 0
src/pages/index/tabs/Mine.jsx ファイルの表示

@@ -0,0 +1,7 @@
1
+import React from 'react'
2
+
3
+export default (props) => {
4
+  return (
5
+    <view>个人中心</view>
6
+  )
7
+}

+ 7
- 0
src/pages/index/tabs/Recommend.jsx ファイルの表示

@@ -0,0 +1,7 @@
1
+import React from 'react'
2
+
3
+export default (props) => {
4
+  return (
5
+    <view>房东推荐</view>
6
+  )
7
+}

+ 7
- 0
src/pages/index/tabs/Strategy.jsx ファイルの表示

@@ -0,0 +1,7 @@
1
+import React from 'react'
2
+
3
+export default (props) => {
4
+  return (
5
+    <view>定制攻略</view>
6
+  )
7
+}