svelte-reactive-assignments

在 Svelte 中處理狀態更新 如何使用 Svelte 中的反應式賦值來處理組件內的狀態更新 Svelte 的一個很棒的地方是,你不需要做任何特殊的事情來更新組件的狀態。 你只需要一個賦值操作。 假設你有一個 count 變量。你可以用 count = count + 1 或者 count++ 來對其進行增加: <script> let count = 0 const incrementCount = () => { count++ } </script> {count} <button on:click={incrementCount}>+1</button> 如果你對現代 Web 框架如何處理狀態更新的方式不熟悉的話,這沒有什麼突破性的。但是在 React 中,你需要調用 this.setState() 或使用 useState() hook。 Vue 則採取了一種更結構化的方法,使用類和 data 屬性。 在使用過這兩種方式之後,我發現 Svelte 更像是一種更接近 JavaScript 的語法。 有一件事我們需要注意到,這很容易學到:在更改值時,我們也必須進行賦值。 對於像字符串和數字這樣的簡單值,這通常是理所當然的,因為字符串的所有方法都返回新的字符串,數字也是如此 - 它們是不可變的。 但是對於數組呢?我們不能使用修改數組的方法,比如 push()、pop()、shift()、splice()…,因為沒有賦值的操作。它們改變了內部的數據結構,但是 Svelte 無法檢測到這一點。 嗯,你仍然可以使用它們,但是在進行操作之後,你需要將變量重新賦值給它自身,像這樣: let list = [1, 2, 3] list....