Propiedades bloqueadas (Locked Properties)

Las propiedades de Livewire pueden modificarse libremente tanto en el frontend como en el backend utilizando utilidades como wire:model. Si quieres evitar que una propiedad - como el ID de un modelo - sea modificada en el frontend, puedes utilizar el atributo #[Locked] de Livewire.

Uso básico

A continuación se muestra un componente ShowPost que almacena el ID de un modelo Post como una propiedad pública llamada $id. Para evitar que esta propiedad sea modificada por un usuario curioso o malintencionado, puedes añadir el atributo #[Locked] a la propiedad:

Asegúrese de importar clases de atributos

Asegúrese de importar cualquier clase de atributo. Por ejemplo, el atributo #[Locked] requiere la siguiente importación use Livewire\Attributes\Locked;.

use Livewire\Attributes\Locked;
use Livewire\Component;

class ShowPost extends Component
{
    #[Locked]
    public $id;

    public function mount($postId)
    {
        $this->id = $postId;
    }

    // ...
}

Al añadir el atributo #[Locked], te aseguras de que la propiedad $id nunca será manipulada.

Las propiedades del modelo son seguras por defecto

Si almacena un modelo Eloquent en una propiedad pública en lugar de sólo el ID del modelo, Livewire se asegurará de que el ID no sea manipulado, sin necesidad de añadir explícitamente el atributo #[Locked] a la propiedad. En la mayoría de los casos, este enfoque es mejor que utilizar #[Locked]:

class ShowPost extends Component
{
   public Post $post;

   public function mount($postId)
   {
       $this->post = Post::find($postId);
   }

  // ...
}

¿Por qué no utilizar propiedades protegidas?

Podría preguntarse: ¿por qué no utilizar propiedades protegidas para los datos sensibles?

Recuerde, Livewire sólo persiste propiedades públicas entre peticiones de red. Para datos estáticos, codificados, las propiedades protegidas son adecuadas. Sin embargo, para los datos que se almacenan en tiempo de ejecución, debe utilizar una propiedad pública para asegurarse de que los datos se persisten correctamente.

¿No puede Livewire hacer esto automáticamente?

En un mundo perfecto, Livewire bloquearía las propiedades por defecto, y sólo permitiría modificaciones cuando se usara wire:model en esa propiedad.

Desafortunadamente, eso requeriría que Livewire analizara todas sus plantillas Blade para entender si una propiedad es modificada por wire:model o una API similar.

Esto no sólo añadiría sobrecarga técnica y de rendimiento, sino que sería imposible detectar si una propiedad es mutada por algo como Alpine o cualquier otro JavaScript personalizado.

Por lo tanto, Livewire continuará haciendo las propiedades públicas libremente mutables por defecto y dará a los desarrolladores las herramientas para bloquearlas según sea necesario.