Import useForm from Inertia
import { useForm } from '@inertiajs/inertia-vue3';
const form = useForm({
id: '',
name: '',
})
const submit = () => {
form.post(/* your url */), {
// options
})
}
Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.
In laravel 9 with Inertiajs 3 I use $inertia.form for data saving, like :
<template>
<div v-if="!formEditor.processing">
<input type="text" class="form-control" v-model="formEditor.name"
:class="{ 'is-invalid' : formEditor.errors && formEditor.errors.name }"
>
<div class="invalid-feedback mb-3" v-if="formEditor.errors"
:class="{ 'd-block' : formEditor.errors && formEditor.errors.name}">
{{ formEditor.errors.name }}
</div>
</div>
...
</template>
<script>
import AdminLayout from '@/Layouts/AdminLayout'
export default {
props: ['currency', 'is_insert'], // I got these data from controller
components: {
AdminLayout,
},
data() {
return {
formEditor: this.$inertia.form({
id: '',
name: '',
}),
}
},
methods: {
saveCurrency() {
this.formEditor.post(this.route('admin.currencies.store'), {
onError: (e) => {
console.log(e)
}
})
}, // saveCurrency() {
}
}
</script>
where formEditor is valid inertia form and it worked ok for me, but I failed to remake this code with Composition API, like :
<script>
import AdminLayout from '@/Layouts/AdminLayout'
import {settingsJsMomentDatetimeFormat, settingsAppColors} from '@/app.settings.js'
import {ref} from "vue";
let self= this
console.log('self::')
console.log(self) // I have undefined here
export default {
props: ['currency'],
name: 'CurrencyForm',
components: {
AdminLayout
},
setup(props) {
let currency = ref(props.currency)
console.log('CurrencyForm $inertia::')
console.log($inertia) // I got "ReferenceError: $inertia is not defined error" here
console.log('CurrencyForm this.$inertia::')
console.log(this.$inertia) // THIS WAY DOES NOT WORK here
console.log('CurrencyForm self.$inertia::')
console.log(self.$inertia) // THIS WAY DOES NOT WORK here
let form = this.$inertia.form({
id: '',
name: '',
})
const formEditor = ref( form )
const adminCurrencyFormOnMounted = async () => {
...
}
onMounted(adminCurrencyFormOnMounted)
return { // setup return
...
}
}, // setup() {
}
I failed to create inertia form as I suppose I lost valid inertia context. How can I get it and fix this error ?
Thanks!
Make I make redirect from js script:
In that case, just import Inertia itself https://inertiajs.com/manual-visits#method
import { Inertia } from '@inertiajs/inertia'
Inertia.visit(route('admin.users.index'), {method: 'get'});
Properties of the page :
In this case, you need to import usePage https://inertiajs.com/shared-data#accessing-shared-data
import { usePage } from '@inertiajs/inertia-vue3'
usePage.props.jetstream.flash
Please or to participate in this conversation.