$inertia.back()

[dillingham]

In working with Laravel Jetstream I realized how much I loved having back() in vue-router

Very useful for Cancel buttons in forms that could be reached from multiple locations.

Linking to edit from index & show, cancel cant just link to index or show without disrupting the flow.

Would pair nicely with modals in #584

[reinink]

Hey Brian, is there anything wrong with just using History.back()?

window.history.back()

[dillingham]

Hey @reinink, no that works but you have to make a method:

back() {
    window.history.back()
}

Whereas with $inertia.visit, its global so you can link things like

<tr @click="$inertia.visit(route('posts.show', post.id))">
    <td>{{ post.title }}</td>
</tr>

Having back on $inertia would save having that method in each form component.

<button @click="$inertia.back()">Cancel</button>

[dillingham]

Originally got the idea from Laravel Nova's source

<cancel-button @click="$router.back()" />

[dillingham]

Another consideration: $inertia.back() within modals.
Idk how a modal would be added into history

[claudiodekker]

Haha, yeah, Modals are a known (& admittedly fairly complex) 'todo' 👍

For now, I'd recommend to just do something like this in your app.js:

// Vue 2
Vue.prototype.window = window

// Vue 3
app.config.globalProperties.window = window

Which would allow you to do this in your templates:

<span @click="window.history.back()">Go Back</span>

[dillingham]

@claudiodekker thanks :) That works. For my current purposes.. Im building a generator for jetstream and wanted to include a cancel button in the form it outputs.. and was trying to avoid adding a method or edit any other files. but thanks for the globalProperties.. didn' know that.