Closed J3020605821 closed 1 year ago
只是切换下路由,有时就会什么也不显示
正常时:
白屏时:
请参考 https://github.com/supervons/react-native-echarts-pro/issues/6 提供下示例代码,以及机型型号,方便快速定位。
import React from "react"; import { createBottomTabNavigator } from '@react-navigation/bottom-tabs'; import Charts1 from "../../component/Charts2/index2"; import Charts2 from "../../component/Charts2/index2"; import Charts3 from "../../component/Charts2/index4"; import Charts4 from "../../component/Charts2/index5"; const Stack = createBottomTabNavigator(); const Template: React.FC<{}> = () => { return ( <> <Stack.Navigator screenOptions={{ headerShown: false, tabBarStyle: { display: "none" } }}> <Stack.Screen name="feeding" component={Charts1} options={ { title: "图表1" } } /> <Stack.Screen name="lineTail" component={Charts2} options={ { title: "图表2" } } /> <Stack.Screen name="halt" component={Charts3} options={{ title: "图表3",unmountOnBlur:true}} /> <Stack.Screen name="trayOver" component={Charts4} options={{ title: "图表4",unmountOnBlur:true} } /> </Stack.Navigator> </> ) } // 使用的navigation.navigate(“name”)跳转的 //组件里写本教程的案例,图表位置也会出现空白问题 //问题出在那里?
使用的expo go 打开的
找到原因了吗?抱歉噢,最近有点忙,最好Charts1 ~ Charts4 也提供下吧,方便快速复现。
只知道图表空白时,执行echartsRef.current?.getInstance("getOption").then((res:any)=>{ console.log("res",res); });是不打印的.图表显示时是可以打印的. Charts1 ~ Charts4里的都差不多,大概是这样: const { data, refetch, loading } = useStatFeedingsUsingGET({}})//接口,data是个状态,请求未完成是null,完成是请求的内容 const pieOption = React.useMemo(() =>{ return ... },[data])
<RNEChartsPro ref={myChart} height={250} option={pieOption} />
问题是:首次进入到路由时可能图表白屏,切换路由时也可能白屏
目前我使用防止的方法是等接口请求完成后再显示图表:
{data?<RNEChartsPro ref={myChart} height={250} option={pieOption} />:
null}
难道是createBottomTabNavigator的原因,试了试createNativeStackNavigator几次图表都显示出来了
只知道图表空白时,执行echartsRef.current?.getInstance("getOption").then((res:any)=>{ console.log("res",res); });是不打印的.图表显示时是可以打印的. Charts1 ~ Charts4里的都差不多,大概是这样: const { data, refetch, loading } = useStatFeedingsUsingGET({}})//接口,data是个状态,请求未完成是null,完成是请求的内容 const pieOption = React.useMemo(() =>{ return ... },[data])
<RNEChartsPro ref={myChart} height={250} option={pieOption} />
问题是:首次进入到路由时可能图表白屏,切换路由时也可能白屏 目前我使用防止的方法是等接口请求完成后再显示图表:{data?
<RNEChartsPro ref={myChart} height={250} option={pieOption} />:
null}难道是createBottomTabNavigator的原因,试了试createNativeStackNavigator几次图表都显示出来了
可能是由于图表的渲染早于接口数据返回了,在判断这里增加上 pieOption
数据的判断,有值时才进行渲染。
问题:概率白屏 "react-native-echarts-pro": "^1.8.7", "react-native": "0.69.6", "react-native-webview": "11.23.0", 平台;linux 系统版本;Ubuntu 20.04.4 LTS
究竟那里出了问题