Questions tagged [ionic-react]

The ReactJS version of the Ionic cross platform mobile application development framework.

240 questions
0
votes
1 answer

React Typescript: Passing function as prop to child and call it from the child

I need to pass function as prop to child, then the child needs to call it. Here is my parent: interface DateValue { dateValue: string; } const Page: React.FC = () => { const dateChanged = (value: DateValue) => { console.log(value); …
Alvin Stefanus
  • 1,873
  • 2
  • 22
  • 60
0
votes
2 answers

How to use community HTTP plugin in a Ionic React app when running the app on Android Emulator?

I’m working on an Ionic React App running on top of Capacitor. It works fine with axios requests in browser, but on Android I have CORS issues, that’s why I’m using the community HTTP plugin:https://github.com/capacitor-community/http Example: I…
Ani
  • 788
  • 3
  • 7
  • 21
0
votes
0 answers

Writing test coverage for reactjs component with jest and ionic

I am trying to write a test coverage for my registration component implemented with ionic react. I have a submission function: submitRegistration();that handles the form submission once the form fields are filled. However, I cant get the test to…
Ahmed J.
  • 484
  • 6
  • 11
0
votes
1 answer

Why am I seeing choppy animations (page transitions) in React Router with Ionic 5 on iOS?

I have an Ionic 5 React app that I'm running as a webapp on my server and on iOS. When I access the webapp via a browser, the page transitions are fine. But on iOS, they are extremely choppy-- I am seeing half the animation, a blank screen for about…
Patrick Kenny
  • 4,515
  • 7
  • 47
  • 76
0
votes
1 answer

How do you conditionally display component with ion-segment in Ionic 4 - React

I'd like to have a Registration/Login component that can be switched between by using ion-segment. It's straightforward with ReactJS, but I don't know how to do it with the TypeScript version of React. How do you conditionally display different…
user5410226
0
votes
1 answer

Ioic With react

How can i generate build in ionic with react I follow following step ionic cap add android ionic cap copy android -ionic cap run android This command create android folder but there is no any apk file please help me
Harsh
  • 1
  • 1
0
votes
1 answer

sharing data between two tabs in ionic react

i have App.tsx which is app root and then two tabs tab1.tsx and tab2.tsx. The tab1.tsx has a variable declared as const [coins, setCoins] = useState(0) and tab2.tsx also i have declared the same const [coins, setCoins] = useState(0) but this…
Moblize IT
  • 1,140
  • 2
  • 18
  • 44
0
votes
1 answer

Ionic React too slow to render JSON file containing 100+ objects in IonCard component

I am creating a mobile app with Ionic React. I render multiple IonCards with dynamic data coming from a local JSON file. Actually, I'm mapping through the JSON file. Everything is fine. But it takes a couple of seconds to render all the cards. I…
Mehdi Saqlen
  • 129
  • 1
  • 3
  • 13
0
votes
1 answer

Ionic + React How to return Promise after api call?

I want to return API response JSON into a model class. Sample code is as follows: const authenticateUserAsync = async (username: string, password: string) : Promise => { const loginData = { "Username": username, "Password":…
Ashish Tripathi
  • 580
  • 4
  • 18
0
votes
0 answers

Ionic React - IonRange not showing up properly

I recently got started with Ionic React and I wanted to experiment with the IonRange component. The following is my IonRange code in JSX (alongside a button and some text):
Rohit Karthik
  • 51
  • 2
  • 11
0
votes
1 answer

IonRouterOulet does not apply page transition in ios. Ionic React

I'm trying to apply default transition that comes out of the box from IonRouterOutlet, and i noticed that it only worked on andriod platform not on ios. index.ts ReactDOM.render(
0
votes
1 answer

useIonViewDidEnter in the menu doesn't work in ionic-react

I'm working with ionic react and I want to use useIonViewDidEnter in the menu component but useIonViewDidEnter in the menu component doesn't work and nothing showing in the console, anyone can help, please? const ManagerMenu: React.FC = () => { …
0
votes
1 answer

How to filter ionCards using ionSearchbar in react?

I'm using ionic-framework with react. I want to use ion-searchbar component to filter the cards based on their title. I have used, but stuck in how to add functionality to this searchbar component in react. Please tell me how do I filter ion-cards…
0
votes
1 answer

useIonViewWillEnter has default value of state variable upon re-entry of page

I am not sure if this is expected behavior between Ionic React 4.8.0-rc.0 to 5.2.2 Scenario I have multiple tab where Tab 1 has list of items from API call and Tab 2 has other stuffs. When I first run the app, Tab 1 will trigger API call to…
HP.
  • 19,226
  • 53
  • 154
  • 253
0
votes
3 answers

Page is not rendering after using `history.push` in Ionic/React with `IonTabs` as nested routes

I have an Ionic/React v5.0.7 app with IonReactRouter to manage routing: // App.tsx return (