解讀一些經常使用的方法

$subscribe和$onAction

subscribe和onAction都是執行addSubscription方法只是subscribe多了一步對state進行watch

$subscribe(callback, options = {}) {
    const removeSubscription = addSubscription(
      subscriptions,
      callback,
      options.detached,
      () => stopWatcher()
    )
    // 對原始物件進行watch，這種觸發就是direct型別
    const stopWatcher = scope.run(() =>
      watch(
        () => pinia.state.value[$id] as UnwrapRef<S>,
        (state) => {
          if (options.flush === 'sync' ? isSyncListening : isListening) {
            callback(
              {
                storeId: $id,
                type: MutationType.direct,
                events: debuggerEvents as DebuggerEvent,
              },
              state
            )
          }
        },
        assign({}, $subscribeOptions, options)
      )
    )!

    return removeSubscription
  }
 

addSubscription方法

export function addSubscription<T extends _Method>(
  subscriptions: T[],
  callback: T,
  detached?: boolean,
  onCleanup: () => void = noop
) {
  // 加入訂閱的陣列
  subscriptions.push(callback)

  const removeSubscription = () => {
    const idx = subscriptions.indexOf(callback)
    if (idx > -1) {
      subscriptions.splice(idx, 1)
      // 如果是subscribe 則會同步關閉state的watch
      onCleanup()
    }
  }

  if (!detached && getCurrentScope()) {
    // 呼叫的陣列銷燬則會去掉訂閱
    onScopeDispose(removeSubscription)
  }

  return removeSubscription
}