You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Describe the bug
I'm using the react-native-react-bridge package to render a React component inside a WebView using the webViewRender function. However, when I run the app, the WebView displays a completely blank (white) screen. No errors are logged, and the expected styled content does not appear.
I suspect the issue might be related to how the webViewRender function generates the HTML or how the WebView is rendering it in React Native.
Platform:
Version of [react-native]: [0.74.3]
Version of this package: [0.12.3]
OS: [iOS, Android]
Running on: [Device, Simulator]
JavaScript engine: [Hermes]
Additional context
HomeScreen.tsx
import React from 'react';
import WebView from 'react-native-webview';
import AppLayout from '~containers/AppLayout/AppLayout';
import Chart from '../../components/chart/Chart';
import styles from './HomeScreen.style';
Describe the bug
I'm using the react-native-react-bridge package to render a React component inside a WebView using the webViewRender function. However, when I run the app, the WebView displays a completely blank (white) screen. No errors are logged, and the expected styled content does not appear.
I suspect the issue might be related to how the webViewRender function generates the HTML or how the WebView is rendering it in React Native.
Platform:
Additional context
HomeScreen.tsx
import React from 'react';
import WebView from 'react-native-webview';
import AppLayout from '~containers/AppLayout/AppLayout';
import Chart from '../../components/chart/Chart';
import styles from './HomeScreen.style';
const HomeScreen = () => {
return (
<WebView source={{ html: Chart }} scrollEnabled={false} />
);
};
export default HomeScreen;
Chart.tsx
import React from 'react';
import { webViewRender } from 'react-native-react-bridge/lib/web';
const Chart = () => {
return (
<div
style={{
backgroundColor: '#f5f5f5',
borderRadius: '8px',
padding: '20px', //
boxShadow: '0 4px 6px rgba(0, 0, 0, 0.1)',
textAlign: 'center',
fontFamily: 'Arial, sans-serif',
fontSize: '18px',
color: '#333',
}}>
Hello World!
);
};
export default webViewRender();
The text was updated successfully, but these errors were encountered: