使用 livewire 动态添加或删除元素

Question

在 LiveWire 我尝试在现有数组中添加一些值我将其定义为 component 中的一个字段，但是当我想在其中添加值时，我有执行此操作后的新数据换句话说就是清除和设置新值的原因，例如：

class Students extends Component
{
    public $inputs = [];
    public $i = 1;

    public function add($i)
    {
        $i = $i + 1;
        $this->i = $i;
        array_push($this->inputs ,$i);
    }
 
    public function remove($i)
    {
        unset($this->inputs[$i]);
    }
}

<p wire:click="add(1)" class="t-text-lg">
    ...
</p>

这里当我调用 add 函数时，input 值总是 2，每次调用 add 函数都应该递增。

输出：

array:1 [▼
  0 => 2
]

Answer 1

public function add($i)
{
    $this->i = $this->i + $i;
    array_push($this->inputs ,$this->i);
}

Answer 2

根据您的逻辑，$i 的值将始终为 2。

wire:click="add(1)"

public function add($i)
{
    $i = $i + 1;
    $this->i = $i;
    array_push($this->inputs ,$i);
}

每次单击 p 元素时，都会将值 1 发送到 add 函数，然后该函数只会添加 1 并将其保存为新值$this->i。如果您检查 $inputs 数组，您会看到它充满了所有值为 2.

的元素

array:2 [▼
  0 => 2
  1 => 2
]

您更可能想要的是：

public function add($i)
{
    $this->i = $this->i + $i;
    array_push($this->inputs, $this->i);
}

导致：

array:2 [▼
  0 => 1
  1 => 2
]

使用 livewire 动态添加或删除元素

Dynamicaly add or remove elements with livewire

laravel

laravel-livewire