-1

I would like to send a series of local image files to a component so that they could be rendered. I haven't found any way to do it where images were from local storage. I've only seen it where the images had online links and those links were stored in an object where they were then pulled from. Is there a way I could store multiple locations in an object and then send that to the component?

Product.Component.js

const Product = ({ image }) => {
    return (
        <View style={styles.container}>
            <Text></Text>
            <View>
                <Image
                    style={{ width: 225, height: 225 }}
                    source={image}
                />
            </View>
            <View style={styles.button}>

            </View>
        </View>

    )
}

App.js

import Product from './components/Product.Component'
import {Image} from 'react-native';


export default class App extends React.Component {

render() {


    return (
      <Container style={styles.container} >

        <Product 

          style={{ width: 225, height: 225 } }
          <Image source={require('./assets/images/logo/myimage.png')}/>
        />
      </Container >
    );

}
BayCode
  • 93
  • 11

1 Answers1

0
import MyImage from './assets/images/logo/myimage.png'

<Image source={MyImage}/>
ludwiguer
  • 2,177
  • 2
  • 15
  • 21
  • ``` import MyImage from './assets/images/logo/myimage.png' /> ``` it says Type arguments can only be used in TypeScript files.ts(8011) – BayCode Jun 28 '20 at 23:37
  • I think your jsx is wrong, you are putting the Image as a prop of Product, it should be ` ` – ludwiguer Jun 29 '20 at 00:00
  • I just watched again your code and image indeed is a prop of Product, then it should be `` – ludwiguer Jun 29 '20 at 00:02
  • Also, you can remove the style prop from the Product component since you are not using it anywhere – ludwiguer Jun 29 '20 at 00:02
  • While this link may answer the question, it is better to include the essential parts of the answer here and provide the link for reference. Link-only answers can become invalid if the linked page changes. - [From Review](/review/low-quality-posts/26537658) – ridvankucuk Jun 29 '20 at 13:34
  • @ridvankucuk which link? – ludwiguer Jun 29 '20 at 13:38