ux
ux copied to clipboard
[LiveComponent] LiveProps not correctly updated from PostMount after updateFromParent
Context: I have 2 components with one nested in the other:
class LessonListContainerComponent
{
// ...
#[LiveProp]
public array $filters = [];
// ... some actions that change the filters
}
// ...
{{ component('lesson-list',{
filters: filters
}) }}
// ...
class ListComponent
{
// ...
#[LiveProp(updateFromParent: true)]
public array $filters = [];
#[LiveProp(writable: true)]
public array $listIds = [];
#[PostMount]
public function initList(): void
{
// modifying listIds depending on the filters
$listIds = XX;
}
// getting the object list based on what was computed in initList()
public function getList(): array
{
if (!empty($this->listIds)) {
return $this->someRepository->findBy(['id' => $this->listIds]);
}
return [];
}
// ... actions for paginations and other stuff
}
Problem (?) I debugged and here are my observations:
- PostMount method
initList()is correctly called at first render andlistIdsvalue correctly computed. - When I change the filters in the parent component, the child component get correctly the new filters value.
- The postMount
initList()method is called on filters update and the value oflistIdsis recomputed and set. - When calling getList() later in the template (for re-render after filters changed), the value of
listIdsis not the value that was recomputed in postMount, but the value computed at first render (also in postMount).
Questions Is this the expected behavior ? It feels weird that the LiveProp is not updated the second time the PostMount method is called (and all subsequent calls).
Workaround I force the re-render of the child component with an id.
{{ component('lesson-list',{
filters: filters,
id: this.generateNewListId(),
}) }}
This is indeed the method suggested by the documentation: https://symfony.com/bundles/ux-live-component/current/index.html#child-components-keep-their-modifiable-liveprop-values
Thank you for this issue. There has not been a lot of activity here for a while. Has this been resolved?