提交表单后重定向用户

Question

我在 <form> 中有一个 <input type="text" /> 作为搜索栏。

因为它是一个搜索栏，用户应该被重定向到类似于以下的路径：/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

Check out Sappers goto function。它可能会满足您的目的。

以下是如何使用代码。

<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>

提交表单后重定向用户

Redirect the user after a form submission

svelte

sapper