如何让Svelte Store订阅始终触发，即使新旧值相等？

针对Svelte writable store设置相同值时不会触发订阅的问题，以下是几种更优雅的解决方式，满足你保留字符串类型且每次点击都触发通知的需求：

1. 自定义支持强制更新的Writable Store #

封装原生writable，添加alwaysUpdate参数，让store忽略值的比较逻辑，每次调用set都触发订阅：

import { writable as svelteWritable } from 'svelte/store';

export function writable(initialValue, alwaysUpdate = false) {
  const { subscribe, set: originalSet, update } = svelteWritable(initialValue);
  
  const set = (newValue) => {
    if (alwaysUpdate) {
      // 通过临时值触发原生更新逻辑，确保订阅者收到通知
      originalSet(Symbol('__temp__'));
      originalSet(newValue);
    } else {
      originalSet(newValue);
    }
  };

  return { subscribe, set, update };
}

使用方式完全符合你的预期：

export const idOfClickedElement = writable<string | null>(null, true);

// 即使传入相同的id，每次调用set都会触发订阅
idOfClickedElement.set('element-123');

2. 轻量包装：带版本标记的元组（替代随机数方案） #

如果不想自定义store，可以用元组包装字符串+版本标记（时间戳/递增数），语义比随机数更清晰：

import { writable } from 'svelte/store';

export const idOfClickedElement = writable<[string | null, number]>([null, 0]);

// 点击时更新：用时间戳作为版本标记
idOfClickedElement.set(['element-123', Date.now()]);

// 订阅时仅关注第一个元素（id）
idOfClickedElement.subscribe(([id]) => {
  if (id) {
    // 处理点击逻辑
  }
});

3. 临时切换值触发更新（快速 hack） #

如果只是临时需求，不想封装或包装，可以通过先设置不同值再切回目标值的方式触发订阅：

// 点击时调用
const targetId = 'element-123';
idOfClickedElement.set(null);
idOfClickedElement.set(targetId);

注意：这种方式会触发两次订阅，需要确保你的订阅逻辑能处理重复触发的情况。

最优推荐 #

第一种自定义store的方案是最优雅的，既保留了原生writable的使用习惯，又通过参数控制实现了强制更新，完全匹配你想要的writable(initialValue, alwaysUpdate)的理想用法。

内容的提问来源于stack exchange，提问作者bersling