Grid is not rendered correctly when treating vec of signals as slices about leptos

[gbj]

Steps I took to debug:

1. Saw that this was a keyed list, and that the issue was solved by fixing the keys. Wondered whether there could be duplicated keys.
2. In <BadTable/>, I added an effect to log out the keys:

    create_effect(move |_| {
        leptos::logging::log!(
            "{:?}",
            rows().into_iter().map(|tuple| tuple.0).collect::<Vec<_>>()
        );
    });

3. Saw that this logs twice when I resize. This is because you update two separate signals in the event handler, and read from both of those signals in the let rows definition. In Leptos 0.6 and earlier, signal updates/effects are not batched by default but run synchronously — so the rows are basically updated twice when you click, one for each signal they depend on. Note that rows reads from the grid signal, but the keys don't depend on the grid signal (unlike in GoodTable), so an "old" row sticks around.
4. I added batch(move || { ... }) inside the resize function:

    let resize = move |dim: Dimensions| {
        batch(move || {
            set_dimensions.update(|dimensions| *dimensions = dim); // this can be .set() btw
            let mut new_vec = vec![];
            for _ in 0..dimensions.with(|d| d.width * d.height) {
                new_vec.push(create_signal(Cell { example: false }));
            }
            set_grid.update(|grid| *grid = new_vec); // this can be .set() btw
        });
    };

Works as expected.

---

Broader point: There's no reason to use <For/> here, as you are invalidating every key on every dimension change anyway, so all of them will be replaced when the dimensions change. If you use plain iteration it will perform exactly the same and you won't have the key or batching issue.

[Neighborkid01]

Thanks so much!