当任何一组变量发生变化时，Svelte 执行函数

Question

$: query && getData();

这会在页面大小或其他查询参数发生变化时调用 REST API。

我有类似的上市实体情况，并且做：

 $: activePage && sort && pageSize && getData();

这一切都很好（虽然 && 是一个奇怪的结构，表示我想在 activePage、sort 或 pageSize 更改时执行 getData()。

使用这种方法时，如果您还想包含计算结果为 Falsy 的变量，就会出现问题。

例如，添加searchQuery文本：

let searchQuery = "";
$: searchQuery && activePage && sort && pageSize && getData();

现在反应性不起作用，因为 searchQuery 计算为 false。

我们可以这样做：

$: activePage && sort && pageSize && getData();
$: searchQuery, getData();

但是这个 getData() 被调用了 2 次。

有人知道更好的方法吗？

Answer 1

您可以将 , 和 && 语法与任意数量的变量和条件一起使用

$: searchQuery, activePage && sort && pageSize && getData();

$: searchQuery, activePage, sort, pageSize, getData();

都是有效的，对于第二个，如果其中一个变量是假的，你不会有问题，而第一个可以让你确保一些变量不是假的。

Answer 2

为了使事情更清楚，您可以将观察到的变量作为参数传递给函数：

$: onChange(searchQuery, activePage, sort, pageSize);

function onChange(...args) {
  getData();
}

因此，您不必担心某些变量是假的。

Svelte execute function when any of group of variables changes