自动触发功能预渲染Symfony LiveComponent

Question

我有一个包含一系列价格的 LiveComponent，具体取决于是否选中复选框，价格应含增值税或不含增值税。

这个效果很好。问题是：

• 当我选中该框时 -> 价格会更新，其中包含增值税（如预期）。
• 我刷新页面
• 该框仍处于选中状态（如预期）-> 但价格不再含增值税。

因此LiveComponent保存了复选框的状态，但根据状态刷新后不会触发正确的操作。

我想我可以使用

#[PreReRender]

来修复它。

<?php


#[AsLiveComponent]
class MyLiveComponent
{
    use DefaultActionTrait;
    use ComponentWithFormTrait;
    use ComponentToolsTrait;

    public function __construct(
      
    )
    {
    }

    #[LiveProp(hydrateWith: 'hydratePricings', dehydrateWith: 'dehydratePricings')]
    public array $pricings = [];

  
    #[LiveProp]
    public bool $inclVat = false;


    #[LiveAction]
    public function toggleInclVat(#[LiveArg] bool $checked): void
    {
        $this->inclVat = !$checked;

        if ($this->inclVat) {
            $this->setPricesInclVat();
        }
    }

    #[PreReRender(-1)]
    public function setVatPrices(): void
    {
        if ($this->inclVat) {
            $this->setPricesInclVat();
        }
    }

  
   
    private function setPricesInclVat(): void
    {
        foreach ($this->pricings as $pricing) {
            $pricing = $pricing * (1 + 0.21));
        }
    }
}

功能

setVatPrices()

被触发，但不更新价格。也许是因为渲染前未设置

$this->prices

？

Answer 1

#[PreReRender] 在这种情况下并不理想 - 它不会在请求之间重新初始化或保留状态，我会主张安装函数，它可以更好地初始化渲染属性。

还要使 inclVat 可写，这样你最终会得到这样的结果：

#[LiveProp(writable: true)]
public bool $inclVat = false;

public function mount(): void
{
    $this->updatePrices();
}

#[LiveAction]
public function toggleInclVat(#[LiveArg] bool $checked): void
{
    $this->inclVat = $checked;
    $this->updatePrices();
}

private function updatePrices(): void
{
    if ($this->inclVat) {
        $this->setPricesInclVat();
    } else {
        $this->setPricesExclVat();
    }
}