Property Attributes: Locked, URL, Computed

Livewire 3 was released with a few features using PHP Attributes on top of Component properties. In this lesson, let's look at them.

Locked Properties

Livewire properties can be modified on both the frontend and backend. Sometimes this could be a security breach if someone tries to change the input value in their browser console. To prevent it, we can lock public properties.

To lock a public property, you must add a #[Locked] attribute.

use Livewire\Attributes\Locked;
 
class ShowPost extends Component
{
    #[Locked]
    public int $id;
 
    public function mount($postId): void
    {
        $this->id = $postId;
    }
 
    // ...
}

If you try to modify the $id property, Livewire will throw an Exception.

When using Model as a property, Livewire automatically will protect model's ID.

use App\Models\Post;
 
class ViewPost extends Component
{
    public Post $post;
 
    public function mount(Post $post): void
    {
        $this->post = $post;
    }
 
    // ...
}

Properties with URL Attribute

Sometimes you might want to store component's properties in the URL. For example, when building...