Questions tagged [react-image]

React Image is a reactjs component that facilitates loader and fallback lifecycles

62 questions
0
votes
0 answers

Invalid hook call error after using React-img-mapper

I want to use react-img-mapper for my app too make a clickable world map. i installed it with npm and imported like this. import React from 'react' import map from './coords.json' import ImageMapper from 'react-img-mapper'; import world from…
0
votes
1 answer

How do I add an image from a CDN in React Native?

I'd like to display an image in a React Native app from 'cdn.weatherapi.com/weather/64x64/day/116.png' this is what I'm trying at the moment but it isn't working:
hanumanDev
  • 6,592
  • 11
  • 82
  • 146
0
votes
1 answer

How do I pass an entire image element as a prop in React?

I am getting a JSON response that has an image property for each key. This image property is the entire image element tag with properties. I am trying to pass that down into a child component, but upon attempting to render, it just shows up as plain…
0
votes
1 answer

How to use NextJS Image Component to display images receiving through props?

Simply I wanna display images that I'm receiving through props import Image from "next/image"; import classes from "./book-item.module.css"; export default function FoodItems(props) { return (
  • Mohit
    • 135
    • 10
    0
    votes
    2 answers

    What is the correct way to dynamically set image src to remote url in React (18)

    I'm learning React (v18) and I've tried implementing some similar solutions that I've found here, but so far no success. I have been trying display "cards" with names and pictures from a list of authors; the url for the each picture is remote (for…
    GustavoAdolfo
    • 361
    • 1
    • 9
    • 23
    0
    votes
    0 answers

    How to show image on mouse hover using "ReactImageTooltip" in Reactjs

    I want to show an image on mouse hover. I am having a hard time figuring how to show an image on mouse hover. I am using "ReactImageTooltip" which appears when I hover on an element, It shows the image 'Behind' the material UI list, but I want that…
    Bikram
    • 33
    • 4
    0
    votes
    1 answer

    Take Image from API and store it in a object

    I am trying to use react image gallery which is pretty good for me. Here I am kinda stuck on something as I am not good with react so any help would be appreciated. Here I am taking images from api and I get the image in my…
    0
    votes
    1 answer

    how to properly style image in react native

    I've just started learning React Native.. this is what my current app looks like this is my code so far: import { StatusBar } from 'expo-status-bar'; import { SafeAreaView, StyleSheet, Text, Image, View, Button, TextInput } from…
    dapidmini
    • 1,490
    • 2
    • 23
    • 46
    0
    votes
    2 answers

    Image not getting rendered in react application

    Unable to render images in react, In browser console, image names are displayed correctly but on UI it is not displayed. Also, src attribute is missing from img tag after inspecting element. Please assist. Here is Sample Script function importAll(r)…
    0
    votes
    1 answer

    Mulitple image add in react js

    I am working on a project where I have one page where you should be able to add images. One by one it's worked perfectly. Now I want to make to be able to multiple add and upload. I don't want to use any library for image upload. const…
    bajrax
    • 47
    • 3
    0
    votes
    1 answer

    Remove missing Images from array React.js

    I have array of images coming from external API, I want to filter images which are broken before showing them on carousel. as you can see now I map every image and showing MissingImage component as unloader if image is missing, but in my situation…
    0
    votes
    1 answer

    Image Sheet in React Native

    Any idea how to use image sheets in react native? For instance, if I have an image sheet like this, is there a way that I can define the frame dimensions and reuse one single image to display multiple icons? similar question: How can I use my…
    0
    votes
    1 answer

    Dynamic image src linking in react doesn`t work (multiple tries)

    In my project I need to link a img src dynamically. This is the whole project structure: I have tried multiple ways to link up my imag src in the follwing component, as you can see in the out commented part of my code. The path itself cannot be the…
    Fabian Andiel
    • 321
    • 1
    • 13
    0
    votes
    1 answer

    How to show the images of card components that exist outside the src folder in ReactJs?

    I have a react app which integrated with FastAPI and MongoDB. In my project, there is a page to show some information as cards. These cards contain images, but those images are generated automatically in the backend folder. Each card contains the…
    0
    votes
    2 answers

    How can I use default image if Image url gives 404 error in react native?

    I want to load a default image if the image URL gives a 404 error. I tried onError() in image prop but it's not working. { setError(true); }} source={{ …
    Harsh Mishra
    • 862
    • 3
    • 15
    • 29