title: Dynamic HTML table in React Native PDF
body: <p><strong><code>listData</code></strong> below is a dynamic array of data. I'm trying to print the data in to a PDF using <code>expo-print</code>.
  How can I dynamically populate required number of table rows based on the array length and print each result in a seperate row?</p>
  <pre><code>&quot;listdata&quot;: [
      &quot;OAG0001&quot;,
      &quot;RAA0012&quot;,
      &quot;RAA0098&quot;,
      &quot;RAB0023&quot;,
      &quot;UAE0014&quot;
    ]
  </code></pre>
  <p>What I've tried so far below obviously prints the total array in to a single table row.</p>
  <pre><code>const printLoadOutData = () =&gt; {
          setPrintLoadoutLoader(true);
  
          const dataLoadOutToprint = `
          &lt;html&gt;
          &lt;header&gt;
          &lt;/header&gt;
          &lt;title&gt;&lt;/title&gt;
              &lt;style&gt;
                  table, th, td {
                  border:1px solid black;
                  }
              &lt;/style&gt;
          &lt;body&gt;
              &lt;table &gt;
                  &lt;tr&gt;
                      &lt;td&gt;&quot;${listData}&quot;&lt;/td&gt;
                  &lt;/tr&gt;
              &lt;/table&gt;
          &lt;/body&gt;
          &lt;/html &gt;`;
  
          Print.printAsync({
              html: dataLoadOutToprint,
              width: 3508,
              height: 2480,
              orientation: Print.Orientation.landscape
          })
  
              .then(() =&gt; {
                  setPrintLoadoutLoader(false);
              })
              .catch(() =&gt; {
                  setPrintLoadoutLoader(false);
              })
      }
  </code></pre>