react-app, Modal not show

[thuantvDr4]

Description

Modal not show on react app

CodeSandbox/Snack link

none

Steps to reproduce

No response

NativeBase Version

3.4.4

Platform

• [ ] Android
• [X] CRA
• [ ] Expo
• [ ] iOS
• [ ] Next

Other Platform

No response

Additional Information

import React, {useState} from "react"; import {Box, Button, FormControl, Input, Modal} from "native-base";

const TestModal =()=> { const [showModal, setShowModal] = useState(false); return <Box> <Button shadow={2} onPress={() => setShowModal(true)}> Button ... </Button> <Modal isOpen={showModal} onClose={() => setShowModal(false)}> <Modal.Content w={300} h={400}> <Modal.CloseButton /> <Modal.Header>Contact Us</Modal.Header> <Modal.Body> <FormControl> <FormControl.Label>Name</FormControl.Label> <Input /> </FormControl> <FormControl mt="3"> <FormControl.Label>Email</FormControl.Label> <Input /> </FormControl> </Modal.Body> <Modal.Footer> <Button.Group space={2}> <Button variant="ghost" colorScheme="blueGray" onPress={() => { setShowModal(false); }}> Cancel </Button> <Button onPress={() => { setShowModal(false); }}> Save </Button> </Button.Group> </Modal.Footer> </Modal.Content> </Modal> </Box>; } export default TestModal;

[mayank-96]

Hello @thuantvDr4, sorry but I'm not able to reproduce your issue, can you please create a codeSandBox/snack link.

[thuantvDr4]

Hello @thuantvDr4, sorry but I'm not able to reproduce your issue, can you please create a codeSandBox/snack link.

I copied that code and paste on codeSandBox, It worked, modal showed when click button. But, when I run on localhost:3000, it is not work. It's magic!

[Viraj-10]

Hi @thuantvDr4, Can you push small code into the GitHub repo from there we can clone it and then try to reproduce it in our local machine. also please provide the information mentioned in the checklist below.

• Project environment (Expo, React Native, etc.)
• Platform (iOS, Android)
• NativeBase version
• Node Version
• Package Manager (npm/yarn)

[uit2712]

I have same this problem when I run on my localhost:3000 for React app, but it works when I deploy code to Netlify. I use code in your library example, but it doesn't work

• Project environment: React
• Platform: Web
• NativeBase version: 3.4.12
• Node Version: v16.16.0
• OS: Mac OS Monterey version 12.5
• Package Manager: yarn

Please check this problem. Thank you in advanced

[jontewks]

Just ran into this as well, thanks for that last comment about deployed code working. I'm using nextjs and when I do yarn dev I also cannot get a modal to show, but when I run the build and serve the built files, it works normally.

[Alpacora]

Fellas try to remove React.StrictMode from your index file, probably will resolve but this is a bug....

[JosefBud]

Fellas try to remove React.StrictMode from your index file, probably will resolve but this is a bug....

This fixed it. Thank you!