electron-sync-state v0.0.7

Electron Sync State

electron-sync-state 是一个用于在 Electron 主进程和渲染进程之间自动同步状态的库。它利用了 Vue 的响应式系统，以及 Vue 3.5 版本提供的新 API，确保状态在进程间保持一致。该库适用于 Vue 以及 @vue/reactivity 3.5 及以上版本。

安装

使用 npm 或 yarn 安装：

npm install electron-sync-state

或

yarn add electron-sync-state

使用

主进程

在主进程中，使用 createRefSyncState 函数创建一个同步状态。

import { createRefSyncState } from 'electron-sync-state/main';
import { Ref } from '@vue/reactivity';

interface AppState {
  count: number;
}

const { state, syncWatchHandle } = createRefSyncState<AppState>({ count: 0 }, {
  channelPrefix: 'app-state',
  debug: true,
  onChange: (newState) => {
    console.log('State changed:', newState);
  }
});

// 你可以通过 state.value 访问和修改状态
state.value.count += 1;

// 暂停同步
syncWatchHandle.pause();

// 恢复同步
syncWatchHandle.resume();

渲染进程

在渲染进程中，使用 useSyncState 钩子来获取和同步状态。

import { useSyncState } from 'electron-sync-state/renderer';
import { IpcRenderer } from '@electron-toolkit/preload';

interface AppState {
  count: number;
}

const { result, syncWatchHandle } = useSyncState<AppState>({
  channelPrefix: 'app-state',
  debug: true,
  onChange: (newState) => {
    console.log('State changed:', newState);
  }
}, window.ipcRenderer as IpcRenderer);

// 访问状态
console.log(result.state.count);

// 暂停同步
syncWatchHandle.pause();

// 恢复同步
syncWatchHandle.resume();

API

createRefSyncState<T>(initState: T, config: SyncStateConfig<T>)

• initState: 初始状态。
• config: 配置对象，包含以下属性：
  • channelPrefix: 用于通信的通道前缀。
  • debug: 是否启用调试模式。
  • onChange: 状态变化时的回调函数。

返回一个包含 state 和 syncWatchHandle 的对象：

• state: 一个 Vue 的 Ref 对象，包含当前状态。
• syncWatchHandle: 包含 pause 和 resume 方法的对象，用于控制同步的暂停和恢复。

useSyncState<T>(config: SyncStateConfig<T>, ipcRenderer: IpcRenderer)

• config: 配置对象，与 createRefSyncState 的 config 相同。
• ipcRenderer: Electron 的 ipcRenderer 实例。

返回一个包含 result 和 syncWatchHandle 的对象：

• result: 包含 loading 和 state 的对象。
  • loading: 是否正在加载状态。
  • state: 当前状态。
• syncWatchHandle: 包含 pause 和 resume 方法的对象，用于控制同步的暂停和恢复。

示例

你可以在 GitHub 仓库 中找到完整的示例代码。

贡献

欢迎提交 Issue 和 PR。请在提交 PR 之前确保通过所有测试。

许可证

MIT