How to change main image slider using thumbnail image on click in react native? - reactjs

I had Created an E-commerce app like Flipkart moreover I have to create the product image. Whenever I click on the bottom thumbnail image the main image needs to be changed dynamically. I have attached the screenshot here for the reference.

Related

React Bootstrap Carousel issue: While sliding the image breaks and shows a blank background

While sliding the image breaks and shows a black background where as it should slide-out/In along with the the next/prev image and there should not be any space between slides
Even copied it from bootstrap website and imported to react in a new component but still the issue persists
Even copied it from bootstrap website and imported to react in a new component but still the issue persists

React JS when click menu button, entire page shift right

I need your suggestion. I want to develop website in React JS. For start I draw a wireframe. I'm planning to use react libraries if possible. Below is my wireframe. Can I know for a start, what I should search. The 1st image will be the UI. When I click the hamburger button, the page will slide right as shown in 2nd image. Please help guys
Image 1
enter image description here
Image 2
enter image description here
There's a few things you will need to consider:
Storing and toggling the open/close state of your sidebar
The layout of your DOM elements
The transformation of your page content
Here's a sandbox to help you out: https://codesandbox.io/s/adoring-napier-s8gs09?file=/src/App.js

React Native Export Whole Content of Scroll View into PDF

I am currently working on a react-native project and I am facing the following problem:
I have a ScrollView with dynamic size. I would like to be able to export the content of the ScrollView into a PDF on click of a button. It is like creating a screenshot that scrolls through my whole view before saving the image into a pdf. How can I achieve that ?
I know that there is a component called "react-pdf" that I can use to render my own pdf. Is this the way to go ?
I have also seen that there is a component called "react-native-view-shot" which takes a picture of a view. But in my case it is a ScrollView so I don't think that it will work

Nested layout in react web component to show iphone preview screen stackoverflow

How to create UI in React Web App which will show the preview of mobile app screen inside phone layout in order to show how it will look on for e.g. iPhone 8.
So my react web app has a component inside which preview frame layout should show some mobile's layout and dynamically change content such as text/image inside that preview window

I want to add caption on the image like whatsapp in my react native app

Right now I am able to click image from expo camera and able to view it and save it in my phone. I want to add caption on that Image in my App created by expo like we can do in Whatsapp. How can I do that?

Resources