NervJS / taro

开放式跨端跨框架解决方案,支持使用 React/Vue/Nerv 等框架来开发微信/京东/百度/支付宝/字节跳动/ QQ 小程序/H5/React Native 等应用。 https://taro.zone/
https://docs.taro.zone/
Other
35.58k stars 4.8k forks source link

自定义tabbar 页面配置 config 开启下拉刷新无效 #8951

Closed wzyaooh closed 2 years ago

wzyaooh commented 3 years ago

相关平台

微信小程序

小程序基础库: 2.16.0 使用框架: React

复现步骤

1.自定义tabbar 2.以组件的形式关联每个页面 3.设置页面的index.config.js 配置enablePullDownRefresh:true,backgroundTextStyle:'dark' 4.页面里onPullDownRefresh() 获取操作 无效 , 5.页面也无法刷新

期望结果

自定义后tabbar后 可以正常使用page配置下的所有方法

实际结果

自定义后tabbar后 无法使用page配置下的所有方法

环境信息


  Taro CLI 3.0.17 environment info:
    System:
      OS: macOS 11.2.3
      Shell: 5.8 - /bin/zsh
    Binaries:
      Node: 12.17.0 - /usr/local/opt/node@12/bin/node
      Yarn: 1.22.4 - /usr/local/bin/yarn
      npm: 6.14.4 - /usr/local/opt/node@12/bin/npm
    npmPackages:
      @tarojs/components: 3.0.17 => 3.0.17 
      @tarojs/mini-runner: 3.0.17 => 3.0.17 
      @tarojs/react: 3.0.17 => 3.0.17 
      @tarojs/runtime: 3.0.17 => 3.0.17 
      @tarojs/taro: 3.0.17 => 3.0.17 
      @tarojs/webpack-runner: 3.0.17 => 3.0.17 
      babel-preset-taro: 3.0.17 => 3.0.17 
      eslint-config-taro: 3.0.17 => 3.0.17 
      react: ^16.10.0 => 16.14.0 

补充信息

无法获取page 里的方法 自定义tabbar 后被componet所托管 使用自定义tabbar后如何使用页面配置(index.config.js)里的配置内容

Chen-jj commented 2 years ago

没有复现。自定义 TabBar 是 Component,页面是 Page。设置自定义 TabBar 不影响 Page 生命周期的执行。

import { Component } from 'react'
import { View, Text } from '@tarojs/components'
import Taro from '@tarojs/taro'

import type CustomTabBar from '../../custom-tab-bar'

export default class Index extends Component {
  pageCtx = Taro.getCurrentInstance().page

  componentDidShow () {
    const tabbar = Taro.getTabBar<CustomTabBar>(this.pageCtx)
    tabbar?.setSelected(0)
  }
  onPullDownRefresh () {
    console.log('onPullDownRefresh: ', )
  }

  render () {
    return (
      <View className='index'>
        <Text>我是首页!</Text>
      </View>
    )
  }
}

image