在登陆页面上,用户将输入他们正在寻找的狗品种。提交后,该值将被全局保存,该品种的名称将被传递到新的路线。我尝试使用商店更新和调用该值,但迄今为止没有运气。
Store.js
import { writable } from "svelte/store";
const dog = writable("");
export default dog;
+page.svelte(登录页面)
<script>
let dog_val = ""
const handleSubmit = async (e) => {
e.preventDefault();
console.log(dog_val);
dog.set(dog_val)
window.location.href = "/dog"
}
</script>
<main>
<input bind:value={dog_val} placeholder="Search for a dog breed" />
<button on:click={(e) => handleSubmit(e)}>Search This Breed</button>
</main>
+页面.svelte(狗页面)
<script>
let dog_val = "";
dog.subscribe(prev_val => {dog_val = prev_val})
</script>
<main>
<h1>{dog_val}</h1>
</main>
2条答案
按热度按时间w8f9ii691#
添加此行
要使用从文件导出的值/函数,必须先导入该文件。
因此,在
+page.svelte
中的script标记后的第一行中添加以下代码行:b1zrtrql2#
将
import dog from './Store.js';
添加到您正在使用商店的页面上每个<script>
的顶部。