For component not displaying values

What am I doing wrong here??

import { For } from "solid-js";

const ratings = [1, 2, 3, 4, 5];

export default function Ratings() {
   return (
      <form action="thank-you.html">
        <For each={ratings}>
        {(rate) => {
        <div>
        <input type="radio" name="rating" id={rate} />
        <label for={rate}>{rate}</label>
         </div>;
         }}
    </For>
      </form>
    );
}

import { For } from "solid-js";

const ratings = [1, 2, 3, 4, 5];

export default function Ratings() {
   return (
      <form action="thank-you.html">
        <For each={ratings}>
        {(rate) => {
        <div>
        <input type="radio" name="rating" id={rate} />
        <label for={rate}>{rate}</label>
         </div>;
         }}
    </For>
      </form>
    );
}

5 Replies

thetarnav•2y ago

function passed to For is not returning anything you might want to use ts to remove such problems forever

SparrowOP•2y ago

I was supposed to use () after the (rate)=>. It works now

Unknown User•2y ago

Message Not Public

SparrowOP•2y ago

Not a fan of ts, Honestly I can't see any reason to use it

thetarnav•2y ago

it would warn you that the function is not returning anything, when For expects JSX.Element

Gaming

Programming

For component not displaying values