symfony / ux

Symfony UX initiative: a JavaScript ecosystem for Symfony
https://ux.symfony.com/
MIT License
858 stars 314 forks source link

[Live Components] updateFromParent seems not to be working on dataModel parent-child binded properties #790

Open Jim56450 opened 1 year ago

Jim56450 commented 1 year ago

Imagine 2 components like this :

parent_component :

<div {{attributes}}>
    <select data-model="on(change)|postId">
        {% for post in this.posts %}
            <option value="{{ post.id }}"
                    {% if post.id==postId %}
                        selected
                    {% endif %}
            >{{ post.title }}</option>
        {% endfor %}
    </select>

    <input name="title-editor" data-model="post.title" />

    {{ component(child_component, {
        dataModel: 'post.title:title post.content:content',
        'data-live-id': 'post-edit-'~postId
    }) }}

</div>

child_component :

<div {{ attributes }}>
    <input  data-model="debounce(500)|title"/>
    <input  data-model="debounce(500)|content"/>
</div>

child_component title and content properties are both writable and updateFromParent LiveProps.

If you change title-editor input value, it will update the title in the parent component (select is re-rendered), but not in the child component.

weaverryan commented 1 year ago

I wonder if updateFromParent from 2.8 would fix this? https://symfony.com/bundles/ux-live-component/current/index.html#each-component-re-renders-independent-of-one-another

In the code's current form, even if it's not what you want, I actually agree with how it's working right now. Once a child component is rendered, its writable props (e.g. title in this case) become, sort of, "local data": even if the parent re-renders, the child keeps that writable data. The new updateFromParent might allow you to override this behavior.

Jim56450 commented 1 year ago

Hi Ryan !

Thanks for your answer and sorry for the delay. Unfortunately, updateFromParent doesn't fix the problem.

I prepared a reproducer here .

This reproducer discusses about 3 test cases for 2 simple parent / child components, exploring data-model and data-live-id arguments.

Steps :

I added my personal comments on each tab.

Thanks in advance,

Marc.

carsonbot commented 7 months ago

Thank you for this issue. There has not been a lot of activity here for a while. Has this been resolved?

carsonbot commented 6 months ago

Friendly ping? Should this still be open? I will close if I don't hear anything.

carsonbot commented 6 months ago

Hey,

I didn't hear anything so I'm going to close it. Feel free to comment if this is still relevant, I can always reopen!

carsonbot commented 4 days ago

Thank you for this issue. There has not been a lot of activity here for a while. Has this been resolved?