is Index of Store that is array Signal?

I created an array containing several objects based on createStore. When I iterate through this array using a For component and access each object, I don’t need to use a function call to retrieve specific data. This behavior aligns with the documentation. However, when I want to perform actions based on the array’s index (such as deleting the current object), I need to use a function call to correctly obtain the index value. Here’s the code snippet:

    <For each={items}>
              {(item, index) => (
                <div className="container">
                  <div className="level px-6  is-mobile  has-shadow">
                    <div className="level-left">
                      <p>{item.name}-{index}</p>
                    </div>
                    <div className="level-right">
                      <button
                        className="button is-danger is-small"
                        onClick={() => handleDelete(index())}
                      >
                        Delete
                      </button>
                    </div>
                  </div>
                  <hr></hr>
                </div>
              )}
            </For>

    <For each={items}>
              {(item, index) => (
                <div className="container">
                  <div className="level px-6  is-mobile  has-shadow">
                    <div className="level-left">
                      <p>{item.name}-{index}</p>
                    </div>
                    <div className="level-right">
                      <button
                        className="button is-danger is-small"
                        onClick={() => handleDelete(index())}
                      >
                        Delete
                      </button>
                    </div>
                  </div>
                  <hr></hr>
                </div>
              )}
            </For>

is the index a signal? Why I have to access the value via function call in the event of onClick? However, access the value as a property works well in the JSX.

Thanks a lot

    <For each={items}>
              {(item, index) => (
                <div className="container">
                  <div className="level px-6  is-mobile  has-shadow">
                    <div className="level-left">
                      <p>{item.name}-{index}</p>
                    </div>
                    <div className="level-right">
                      <button
                        className="button is-danger is-small"
                        onClick={() => handleDelete(index())}
                      >
                        Delete
                      </button>
                    </div>
                  </div>
                  <hr></hr>
                </div>
              )}
            </For>

    <For each={items}>
              {(item, index) => (
                <div className="container">
                  <div className="level px-6  is-mobile  has-shadow">
                    <div className="level-left">
                      <p>{item.name}-{index}</p>
                    </div>
                    <div className="level-right">
                      <button
                        className="button is-danger is-small"
                        onClick={() => handleDelete(index())}
                      >
                        Delete
                      </button>
                    </div>
                  </div>
                  <hr></hr>
                </div>
              )}
            </For>

is the index a signal? Why I have to access the value via function call in the event of onClick? However, access the value as a property works well in the JSX.

Thanks a lot

is Index of Store that is array Signal?

Similar Threads

is Index of Store that is array Signal?

Similar Threads

Similar Threads

Similar Threads