2. 2
    Update a count state value with the x-on event listener directive in Alpine JS
    1m 58s

Update a count state value with the x-on event listener directive in Alpine JS

InstructorSimon Vrachliotis

Share this video with your friends

Send Tweet

In this lesson, we define a "count" state value with the x-data directive provided by Alpine JS. This defines a new scoped component, which can have access to this state.

We then display the "count" value in our HTML with the x-text directive, which updates an element's innerText value.

We also hook up buttons with click event listeners with x-on:click, which allows us to modify the count value as desired.