使用setKey无法更新nanostore中的对象，求解决方案

错误原因 #

你遇到的setKey does not exist on type 'Notification'错误，是因为setKey是Nanostore的map实例专属方法，但你遍历的n是普通的Notification类型对象（不是map实例），自然没有这个方法。你的$notifications是一个存储Notification数组的map，数组内的每个元素都是普通JS对象，而非独立的map。

正确实现方式 #

要批量更新所有未读通知的状态，需要直接操作$notifications这个map实例，通过set方法更新整个数组的内容：

export function markRead() {
  // 获取当前通知数组
  const currentNotifications = $notifications.get();
  // 遍历数组，将unread为true的项改为false
  const updatedNotifications = currentNotifications.map(notification => 
    notification.unread ? {...notification, unread: false} : notification
  );
  // 更新map中的数组
  $notifications.set(updatedNotifications);
}

优化说明 #

1. 不需要传入通知数组作为参数，直接从$notifications中获取当前状态即可，更符合Nanostore的状态管理逻辑。
2. 使用对象展开运算符{...notification}创建新对象，避免直接修改原数组元素（保持不可变性，符合状态管理最佳实践）。
3. 你的$unreadLength计算可以简化为获取过滤后的数组长度：

export const $unreadLength = computed($notifications, n => n.filter(i => i.unread).length);

完整修正后的存储代码 #

export type Notification = {
  name: string;
  type:
    | "post-reaction"
    | "follow"
    | "joined"
    | "left"
    | "message"
    | "picture-comment";
  avatar: string;
  message?: string;
  time: string;
  postName?: string;
  commentedPicture?: string;
  unread: boolean;
};

export const notification = map<Notification>({
  name: "",
  type: "post-reaction",
  avatar: "",
  time: "",
  postName: "",
  commentedPicture: "",
  message: "",
  unread: false
});

export const $notifications = map<Notification[]>([
  {
    name: "Mark Webber",
    type: "post-reaction",
    avatar: "/avatar-mark-webber.webp",
    message: "",
    time: "1m ago",
    postName: "My first tournament today!",
    commentedPicture: "",
    unread: true,
  },
  {
    name: "Angela Gray",
    type: "follow",
    avatar: "/avatar-angela-gray.webp",
    message: "",
    time: "5m ago",
    postName: "",
    commentedPicture: "",
    unread: true,
  },
  {
    name: "Jacob Thompson",
    type: "joined",
    avatar: "/avatar-jacob-thompson.webp",
    message: "",
    time: "1 day ago",
    postName: "",
    commentedPicture: "",
    unread: true,
  },
  {
    name: "Rizky Hasanuddin",
    type: "message",
    avatar: "/avatar-rizky-hasanuddin.webp",
    message:
      "Hello, thanks for setting up the Chess Club.  I've been a member for a few weeks now and I'm already having lots of fun and improving my game.",
    time: "5 days ago",
    postName: "",
    commentedPicture: "",
    unread: false,
  },
  {
    name: "Kimberly Smith",
    type: "picture-comment",
    avatar: "/avatar-kimberly-smith.webp",
    message: "",
    time: "1 week ago",
    postName: "",
    commentedPicture: "/image-chess.webp",
    unread: false,
  },
  {
    name: "Nathan Peterson",
    type: "post-reaction",
    avatar: "/avatar-nathan-peterson.webp",
    message: "",
    time: "2 weeks ago",
    postName: "5 end-game strategies to increase your win rate",
    commentedPicture: "",
    unread: false,
  },
  {
    name: "Anna Kim",
    type: "left",
    avatar: "/avatar-anna-kim.webp",
    message: "",
    time: "2 weeks ago",
    postName: "",
    commentedPicture: "",
    unread: false,
  },
]);

export const $unreadLength = computed($notifications, n => n.filter(i => i.unread).length);

export function markRead() {
  const currentNotifications = $notifications.get();
  const updatedNotifications = currentNotifications.map(notification => 
    notification.unread ? {...notification, unread: false} : notification
  );
  $notifications.set(updatedNotifications);
}

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