表单提交后重定向用户

Question

我有一个<input type="text" />作为<form>内部的搜索栏。

因为它是一个搜索栏，所以在提交表单时，用户应该重定向到类似于：/search?q=thingIWantToSearch的路线。

目前我正在使用location.href，但我认为这不是一个很好的方法(或者是吗？(

这是我的代码：

<script>
let inputValue = '';
const handleSubmit = () => {
// there should be some parsing before putting it in the url, but it's not the subject
location.href = `/search?q=${inputValue}`;
}
</script>
<form on:submit|preventDefault={handleSubmit}>
<input type="text" bind:value={inputValue} />
<button type="submit">submit</button>
</form>

那么，如何在表单提交时正确重定向用户呢？

Answer 1

查看Sappers goto函数。它可能会达到你的目的。

以下是如何使用您的代码。

<script>
import { goto } from '@sapper/app';
let inputValue = '';
const handleSubmit = () => {
// there should be some parsing before putting it in the url, but it's not the subject
goto(`/search?q=${inputValue}`);
};
</script>
<form on:submit|preventDefault="{handleSubmit}">
<input type="text" bind:value="{inputValue}" />
<button type="submit">submit</button>
</form>