Skip to main content
Craft CMS

Return to Answer

deleted 8 characters in body
Source Link
Ben Croker
Ben Croker
  • 7.8k
  • 27
  • 56

You can maintain state within your component either by using a hidden input field:

{{ hiddenInput('count', count) }}

Or by adding another s-val attribute to each button.

<button sprig s-val:count="{{ count + 3 }}" s-val:offset="{{ offset }}">
    ...
</button>

<button sprig s-val:offset="{{ offset + 3 }}" s-val:count="{{ count }}">
    ...
</button>

Since s-val is inherited, you can add it to a parent element for convenience.

<div s-val:count="{{ count }}" s-val:offset="{{ offset }}">
    <button ...><button>...</button>
    <button ...><button>...</button>
</div>

You can maintain state within your component either by using a hidden input field:

{{ hiddenInput('count', count) }}

Or by adding another s-val attribute to each button.

<button sprig s-val:count="{{ count + 3 }}" s-val:offset="{{ offset }}">
    ...
</button>

<button sprig s-val:offset="{{ offset + 3 }}" s-val:count="{{ count }}">
    ...
</button>

Since s-val is inherited, you can add it to a parent element for convenience.

<div s-val:count="{{ count }}" s-val:offset="{{ offset }}">
    <button ...>...</button>
    <button ...>...</button>
</div>

You can maintain state within your component either by using a hidden input field:

{{ hiddenInput('count', count) }}

Or by adding another s-val attribute to each button.

<button sprig s-val:count="{{ count + 3 }}" s-val:offset="{{ offset }}">
    ...
</button>

<button sprig s-val:offset="{{ offset + 3 }}" s-val:count="{{ count }}">
    ...
</button>

Since s-val is inherited, you can add it to a parent element for convenience.

<div s-val:count="{{ count }}" s-val:offset="{{ offset }}">
    <button>...</button>
    <button>...</button>
</div>
Source Link
Ben Croker
Ben Croker
  • 7.8k
  • 27
  • 56

You can maintain state within your component either by using a hidden input field:

{{ hiddenInput('count', count) }}

Or by adding another s-val attribute to each button.

<button sprig s-val:count="{{ count + 3 }}" s-val:offset="{{ offset }}">
    ...
</button>

<button sprig s-val:offset="{{ offset + 3 }}" s-val:count="{{ count }}">
    ...
</button>

Since s-val is inherited, you can add it to a parent element for convenience.

<div s-val:count="{{ count }}" s-val:offset="{{ offset }}">
    <button ...>...</button>
    <button ...>...</button>
</div>