#Creating elements from object array

5 messages · Page 1 of 1 (latest)

wraith ingot
#

Hi guys, I got this code currently:

 <table>
    <thead>
      <tr>
        <th>Full URL</th>
        <th>Short URL</th>
        <th>Clicks</th>
      </tr>
    </thead>
    <tbody>
      {
        urlData.map((data) => {
          <tr>
            <td>
              <a href={data.full}>{data.full}</a>
            </td>
            <td>
              <a href={data.short}>{data.short}</a>
            </td>
            <td>{data.clicks}</td>
          </tr>;
        })
      }
    </tbody>
  </table>

URL Data is fetched like this:

const response = await fetch("http://localhost:5000/shortener/all");
const urlData = await response.json();

My urlData looks like:

id: 22, 
full: 'https://twitch.tv', 
short: 'GKWGiMnqf', 
clicks: 0 },...]

However the elements are not created for whatever reason, does anyone may know a fix?

heavy flume
#

Since your using curly brackets in your function {} you have to add a return or switch to ()

wraith ingot
#

I don't really understand, could you please explain it further?

#

oh now I got it, switching to normal brackets worked. Could you explain to me why?

heavy flume
#

() is an expression which evaluates into a single value but {} defines the scope of a function and does not return anything so you have to return a value like ‘func() { return <><> }’