machinery-miniapp/src/pages/index/index.jsx

import React, { useState, useEffect } from 'react'
import Taro, { useDidShow } from '@tarojs/taro'
import withLayout from '@/layouts'
import CustomNav from '@/components/CustomNav'
import { useModel } from '@/store'

import tabList from './tabbar'
import Homes from './tabs/Homes'
import Orders from './tabs/Orders'
import Mine from './tabs/Mine'

import './index.less'


export default withLayout((props) => {
  const { router } = props
  const { person } = useModel('userData')

  const { params, path } = router
  const { tab } = params || {}

  const [currentTab, setCurrentTab] = useState(0)

  const [isDidShow, setIsDidShow] = useState(0)

  useDidShow(() => {
    if (!person?.phone) {
      console.log("🚀 ~ file: index.jsx ~ line 28 ~ useDidShow ~ person?.phone", person?.phone)
      Taro.navigateTo({ url: `/pages/UserLogin/index` })
    } else {

      setIsDidShow(isDidShow + 1)

    }
  }, [person?.phone])

  useEffect(() => {
    if (tab) {
      setCurrentTab(tab - 0)
    }
  }, [tab,])


  const handleTabChange = (e) => {
    if (!person?.phone) {
      Taro.navigateTo({ url: `/pages/UserLogin/index` })

    } else {
      const { index } = e.detail
      setCurrentTab(index)

    }

  }


  return (
    <view className='page-index'>

      <view className='index-navbar'>
        <CustomNav title='首页' home />
      </view>
      <view className='index-container'>
        {currentTab === 0 && <Homes />}
        {currentTab === 1 && <Orders router={router} />}
        {/* {currentTab === 2 && <Strategy />} */}
        {currentTab === 2 && <Mine isDidShow={isDidShow} router={router} />}
      </view>
      <view className='index-tabbar'>
        <mp-tabbar extClass='custom-tabbar' current={currentTab} list={tabList} onChange={handleTabChange}></mp-tabbar>
      </view>
    </view>
  )
})