如何在需要時重新渲染 Svelte 元件，特別是在需要再次運行函數屬性時重新渲染。
昨天我遇到了這個問題：我正在使用一個日期選擇器 Svelte 元件 - 其中有兩個實例。
為了讓您更了解背景，我想設置一個開始日期和一個結束日期：
當您點擊開始日期時，日期選擇器會出現：
當您點擊結束日期時，第二個日期選擇器會出現：
問題在於根據開始日期，結束日期有一些限制。例如，一個合理的限制是您不能設置早於開始日期的結束日期。
日期選擇器元件公開了一個名為 selectableCallback 的函數屬性，該函數在元件首次渲染時運行，遍歷日曆中的所有日期，讓我有機會返回 false 來禁用某些日期。
<script>
let endDateSelectableCallback = date => {
//TODO: decide if date is ok
}
</script>
<Datepicker
selectableCallback={endDateSelectableCallback}
>
聽起來很好！
但是，這個函數只在元件首次渲染時運行。
我需要找到一種方法，在其他元件更改其值時重新運行該函數，這樣我就可以移除所有早於所選開始日期的日期。此外，該函數可能需多次運行，因為用戶可能會更改想法。
所以…當在其他元件上選擇日期時，我使用了 on:dateSelected 事件來重新分配給我之前賦值給 selectableCallback 的函數 endDateSelectableCallback：
<script>
let endDateSelectableCallback = date => {
//TODO: decide if date is ok
}
</script>
<!-- 第一個日期選擇器，開始日期 -->
<Datepicker on:dateSelected={e => {
endDateSelectableCallback = endDateSelectableCallback;
}}>
selectableCallback={endDateSelectableCallback}
</Datepicker>
<!-- 第二個日期選擇器，結束日期 -->
<Datepicker selectableCallback={endDateSelectableCallback}>
</Datepicker>
這可能不是最符合 Svelte 寫法的代碼，我可能可以添加一個 refresh={refreshComponent} 屬性代替。但也許這是符合慣例的，因為 Svelte 文檔中也提到，在更新值時添加冗餘賦值以觸發重新渲染。
我認為這是一種非常具體的模式，可能不太常見。據我記得，我以前沒遇到過這個問題，所以到目前為止，我對這個解決方案感到滿意 - 它運作正常。