X-Splade-State Component
The State Component is a convenient wrapper around validation errors, flash data, and shared data.
Errors
The state
prop has a hasError
method, and you may access the first error of a key with the state.errors
object. If you want full access to the server-side error bag, you may use the rawErrors
object. To determine if there are any errors, you may use the hasErrors
boolean.
<x-splade-state> <p v-if="state.hasError('name')" v-text="state.errors.name" /> <div v-for="(errorArray, key) in state.rawErrors"> ... </div> <div v-if="state.hasErrors"> Whoops! </div></x-splade-state>
Flash Data
Similar to validation errors, there is a hasFlash
method and a flash
object to access flashed data.
<x-splade-state> <p v-if="state.hasFlash('message')" v-text="state.flash.message" /></x-splade-state>
Shared Data
The same applies to shared data:
<x-splade-state> <p v-if="state.hasShared('publicKey')" v-text="state.shared.publicKey" /></x-splade-state>