title: Fetching dynamic images in carousel in react native
body: <p>I am using <a href="https://github.com/archriss/react-native-image-gallery" rel="nofollow noreferrer">react-native-image-gallery</a>. In which url's of those images are already given in state in <code>images</code> array. But I want to load these images dynamically which I am fetching from API as shown in code. I am able to save those paths in state but, to show those images it requires domain name that is <code>https://xyz.in/</code>. On which I am stuck how can I show those dynamically fetched images.</p>
  
  <p>Please help.</p>
  
  <p><strong>code:</strong></p>
  
  <pre><code>  constructor(props) {
      super(props);
      this.state = {
        images: [
            { source: { uri: 'http://i.imgur.com/30s12Qj.jpg' } },
            { source: { uri: 'http://i.imgur.com/4A1Q49y.jpg' } },
            { source: { uri: 'http://i.imgur.com/JfVDTF9.jpg' } },
            { source: { uri: 'http://i.imgur.com/Vv4bmwR.jpg' } }
        ],
        fetched_images:[]
      };
    }
  
  
    async componentDidMount() {
        return fetch(`https://xyz.in/api/shop/username`,
      {
        method: "GET",
        headers: {
          'Authorization': `JWT ${DEMO_TOKEN}`
        }
      })
        .then((response) =&gt; response.json())
        .then((responseJson) =&gt; {
          this.setState({
            fetched_images: responseJson.all_images,
          });
      })
    }
  
  
  
    render() {
      return (
        &lt;View&gt;
           &lt;Gallery
              style={{ height:300, width:'100%', backgroundColor: '#696969'}}
              images={this.state.images}
              errorComponent={this.renderError}
              onPageSelected={this.onChangeImage}
              initialPage={0}
            /&gt;
        &lt;/View&gt;
      );
    }
  </code></pre>
  
  <p><strong>json data:</strong></p>
  
  <pre><code>"all_images": [
      {
          "image": "/media/All%20Product%20Images/20150415_093955_2.jpg"
      },
      {
          "image": "/media/All%20Product%20Images/amshoe.jpg"
      },
      {
          "image": "/media/All%20Product%20Images/ckramii.jpg"
      }
  ]
  </code></pre>