json-edit-react icon indicating copy to clipboard operation
json-edit-react copied to clipboard

Support React Native

Open CarlosNZ opened this issue 9 months ago • 15 comments

Originally posted by @michelcrypt4d4mus in https://github.com/CarlosNZ/json-edit-react/issues/46#issuecomment-2104183371

ok so now i tried to use your package in my app and got an error: Property 'getComputedStyle' doesn't exist. any ideas? seems like it might be a dependency issue (maybe related to why it wouldn't install easily) but i'm not a javascript developer really...

This is how i'm using it in a file called current_daemon_status.js. I'm certain that what's in serviceStatus is a valid data structure (i can JSON.stringify() it just fine):

export default function CurrentDaemonStatus() {
    <...snipped API retrieval code...>
    return <JsonEditor data={serviceStatus} />;
}

Here is the App.js file:

export default function App() {
    return (
        <Provider store={store}>
            <View style={styles.container}>
                <ImageBackground source={BACKGROUND_IMAGE} imageStyle={styles.bg_image} resizeMode="cover">
                    <CurrentDaemonStatus style={styles.overlay_text}/>
                </ImageBackground>

                <StatusBar style="auto" />
            </View>
        </Provider>
    );
};

my iOS simulator shows this:

Screenshot 2024-05-10 at 4 25 26 AM

STDERR shows:

 ERROR  ReferenceError: Property 'getComputedStyle' doesn't exist

This error is located at:
    in CollectionNode (created by Editor)
    in div (created by Editor)
    in Editor
    in CollapseProvider
    in ThemeProvider
    in Unknown (at current_daemon_status.js:32)
    in CurrentDaemonStatus (at App.js:20)
    in RCTView (at View.js:116)
    in View (at ImageBackground.js:82)
    in ImageBackground (at App.js:17)
    in RCTView (at View.js:116)
    in View (at App.js:15)
    in Provider (at App.js:14)
    in App (at withDevTools.ios.js:29)
    in withDevTools(App) (at renderApplication.js:57)
    in RCTView (at View.js:116)
    in View (at AppContainer.js:127)
    in RCTView (at View.js:116)
    in View (at AppContainer.js:155)
    in AppContainer (at renderApplication.js:50)
    in main(RootComponent) (at renderApplication.js:67), js engine: hermes

CarlosNZ avatar May 10 '24 08:05 CarlosNZ