title: Expo React Native - Json.map() - Dynamic Data Clickable
body: <p>I'm working on an React Native application where I want to display some part of my elements only when I click another element.</p>
  <p>I achieved that using <code>const [showSlide, setShowSlide] = useState(false);</code> and then using conditionnal show like <code>{showSlide ? (&lt;View&gt;Element&lt;/View&gt;): null}</code></p>
  <p>It work very good in my static demo but I would like to have the same result using <code>json.map()</code> function.</p>
  <p>I don't figure how to make an unique reference to the think I want to hide/show in my map function.</p>
  <p>I made a demo here to show my dynamic data and the static one as a reference of what I want to do : <a href="https://snack.expo.dev/@37creaorganization/json-data---clickable" rel="nofollow noreferrer">https://snack.expo.dev/@37creaorganization/json-data---clickable</a></p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>export default function App() {
  
    const [showSlide, setShowSlide] = useState(false);
  
    return (
      &lt;View style={styles.container}&gt;
      {/* STATIC EXAMPLE */}
      &lt;TouchableOpacity onPress={() =&gt; {setShowSlide(!showSlide)}}&gt;
        &lt;Text style={styles.paragraph}&gt;
          {dataC.customer[0].name}   
        &lt;/Text&gt;
        {showSlide ? (
          &lt;View&gt;
            &lt;Text&gt;{dataC.customer[0].requests[0].title}&lt;/Text&gt;
          &lt;/View&gt;
        ) : null}
      &lt;/TouchableOpacity&gt;
      {/* END OF STATIC EXAMPLE */}
      &lt;View style={{width:"100%", height:5, backgroundColor:"red", marginTop: 10, marginBottom: 10}}&gt;&lt;/View&gt;
      &lt;Text style={{textAlign: "center"}}&gt;DYNAMIC EXAMPLE&lt;/Text&gt;
      {/* DYNAMIC DATA */}
      { dataC.customer.map((customer)=&gt;(
        &lt;TouchableOpacity onPress={() =&gt; {setShowSlide(!showSlide)}}&gt;
          &lt;Text style={styles.paragraph}&gt;
            {customer.name}   
          &lt;/Text&gt;
            &lt;View&gt;
              &lt;Text&gt;{customer.requests[0].title} &lt;/Text&gt;
            &lt;/View&gt;
        &lt;/TouchableOpacity&gt;
      ))}
      {/* END OF DYNAMIC DATA*/}
      &lt;/View&gt;
    );
  }</code></pre>
  </div>
  </div>
  </p>