title: How can I conditionally include images in React Native Component?
body: <p>I am able to add static images to a <code>ListView</code> cell just fine (see code below), but how do I change the icon image dynamically?</p>
  
  <p>From <a href="https://facebook.github.io/react-native/docs/images.html" rel="nofollow">React Native Docs</a></p>
  
  <pre><code>&lt;Image source={require('./img/check.png')} /&gt;
  </code></pre>
  
  <p>is the recommended way to reference image files for both iOS and Android.</p>
  
  <p>I have a component called <code>ExpandingCell</code> that has the option to show a bunch of different icons but everything else remains the same.</p>
  
  <p>In a <code>ListView</code> I create a <code>cell</code> object and then pass it into the <code>ExpandingCell</code> to render</p>
  
  <p>the ListView data source array looks like this:</p>
  
  <pre><code>var LIST_DATA = [
   ...
    {type: 'ExpandingCell', 
     icon: './CellIcons/MagnifyingGlassIcon.png', //unused
     title: 'Lorem Ipsum', 
     detail: 'Donec id elit non mi porta gravida at eget metus.'},
  ...
  ];
  </code></pre>
  
  <p>then in <code>renderCell</code> method it gets passed the above cell object:</p>
  
  <pre><code>renderCell(cell) {
      if (cell.type === 'ExpandingCell') {
          return (
            &lt;ExpandingCell cell={cell} /&gt;
          );
      }
  }
  </code></pre>
  
  <p>Now in <code>ExpandingCell</code> I have this for <code>render()</code>:</p>
  
  <pre><code>render() {
      return (
          ...
          &lt;Image source{
              require('./CellIcons/MagnifyingGlassIcon.png')
          }&gt;
          &lt;/Image&gt;
          ...
      );
  }
  </code></pre>
  
  <p>However, when I try to make use of <code>this.props.cell.icon</code> like this:</p>
  
  <pre><code>&lt;Image source={require(this.props.cell.icon)}&gt;&lt;/Image&gt;
  </code></pre>
  
  <p>I get the following error: <code>Requiring unknown module "./CellIcons/MagnifyingGlassIcon.png".</code></p>
  
  <p>Thanks in advance =)</p>