1

may I know how to change the image to the URL or link in react native? Below are the screenshot and the code:

The image can display at here but I want to make it become a link in attachment field here image

Example of the URL or link: "http://exampleimage.jpg"

Here is the code

<TextInput
 onChangeText={(attachment) => {
 this.setState({attachment})
 }}
 placeholder="Attachment"
 style={styles.input}
/>
{img}
<TouchableOpacity onPress={this.show.bind(this)}>
 <Icon name="device-camera" size={20} color="black"/>
</TouchableOpacity>

...

show(){
pick((source, data) => this.setState({avatarSource: source, data: data}));}

I use the react-native-image-picker to do it. Please advise on how to do it. Any help will be appreciated. Thank you.

Chandresh Khambhayata
  • 1,748
  • 2
  • 31
  • 60
johnhour
  • 119
  • 3
  • 14
  • This is going to be a bit more complicated than you might expect. In order for the image to become available to other users as an attachment, you'll actually need to upload it somewhere on the internet. There's no quick and easy to way to explain it - it'll depend where you want to host your images. – jevakallio Aug 25 '17 at 11:59
  • yeah, I want to upload to the server, if that is the point, may I know how to do it? Thank you – johnhour Aug 28 '17 at 00:29
  • if that is the case can I just use the file path of the picture from the storage? I just want to have the value of it in the attachment field only. Thank you – johnhour Aug 28 '17 at 06:00
  • @jevakallio hi, now I want to try to upload to the Loopback API explorer, may I know after upload the file to the Loopback then how to get the url straight away from it? Thank you – johnhour Oct 25 '17 at 00:42

1 Answers1

0

Create let variable in render block with.

Assign Image Url to let variable using uri .

Add Image tag in render’s return block.

Add Source attribute in Image tag and Assign Let variable name to it.

Add inline style to Image tag.

Mojtaba Moshfeghi far
  • 571
  • 1
  • 5
  • 20