Description
Describe the Bug
When using the :for
attribute feature of Nue, elements inside a for loop with the ref
/name
attribute are not properly registered to the component's this.$refs
value, leading to the parent component's this.$refs
value missing any dynamically-generated named elements regardless of whether the element is a custom component or a standard HTML tag.
Additionally, the value of this
passed to event handlers inside elements instantiated within a :for
loop is different from the value of this
for elements in the rest of the component, and instead the component must be accessed via a special-case lookup to this.$parent
.
See the attached example and screenshot - for context, the output log was generated by clicking each of the buttons once in left-to-right order.
It is very non-obvious that there is an implicit "component boundary" at the for-loop - I'd expect the same this
to be passed to handlers and functions regardless of whether they were generated with a for-loop or not.
Environment
OS: Linux
Nuekit version: 1.0.0-RC3
Minimal Reproduction
<div @name="bugtest">
<div name="test1">
<button :for="name in items" name="{name}" @click="test">{name}
<span name="test_{name}"></span>
</button>
<button @click="test" name="test2">Test Me</button>
</div>
<script>
items = [ "a", "b", "c" ]
test(e) { console.log(this.$refs) }
</script>
</div>