介紹 Origami-State-Manager (OSM)：最少樣板的輕量級狀態管理庫

管理 JavaScript 應用程式中的全域狀態，尤其是當您需要跨 React 和非 React 上下文存取它時，可能具有挑戰性。現有的函式庫通常涉及繁重的設定、不必要的複雜性，並且與 React 緊密耦合。但是，如果您可以透過摺紙的優雅和簡單來管理狀態呢？輸入摺紙狀態管理器（OSM）。

---

什麼是OSM？

Origami-State-Manager (OSM)，發音為“棒極了”， 是一個輕量級狀態管理庫，設計簡單、靈活且可擴展。受日本摺紙藝術（將一張普通的紙轉變成複雜的設計）的啟發，OSM 使您能夠以同樣優雅的方式管理應用程式的全局狀態。就像紙張一樣，它非常輕巧，非常適合注重簡單性和性能的應用程式。

---

為什麼選擇 OSM？

建構 OSM 的旅程始於尋找一種解決方案，該解決方案可以：

• 最小化樣板檔案：狀態管理應該簡單明了，並且需要盡可能少的設定。
• 多才多藝：在 React 和非 React 上下文中無縫工作。
• 保持輕量級：避免使用不必要的程式碼使您的包包變得臃腫。
• 保持靈活性和可擴展性：在保持效能的同時輕鬆適應不同的專案需求。

如果您厭倦了過度設計的解決方案，並且想要能夠正常工作的，OSM 可能是您需要的「很棒」的工具。

---

主要特點

• 最少的設定： 使用乾淨、直覺的 API 快速定義和管理您的全域狀態。
• React 和非 React 相容性： 可以從 React 元件和純 JavaScript 函數存取和更新狀態。
• 輕量級： OSM 輕如紙，讓您的應用程式保持快速反應。
• 持久化選項：透過簡單的配置使您的狀態持久化。

---

OSM 入門

準備好為您的應用程式添加一些 OSM 功能了嗎？以下是如何開始：

1。安裝庫：

npm install origami-state-manager

2。創建商店：

商店是全球所有狀態所在的地方。設定一個就像將初始狀態值傳遞給 createStore 一樣簡單：

// store.ts
import { createStore } from "origami-state-manager";

const initialValues = {
  origami: 0,
  osmness: 0,
};

export const store = createStore(initialValues);

您也可以透過提供商店名稱來讓商店持久化：

export const store = createStore(initialValues, "myOSMness");

3。訪問和更新狀態：

對於 React 元件，使用 useStateListener 鉤子來存取和更新狀態：

import { store } from "./store";
import { useStateListener } from "origami-state-manager";

function OrigamiComponent() {
  const origami = useStateListener("origami", store);

  return (
    <button onClick={() => store["origami"].value = new Date().getSeconds()}>
      Origami Count: {origami}
    </button>
  );
}

4。非 React 函數中的存取狀態：

您也可以輕鬆地使用 React 以外的狀態：

// utils.js

function getProfile() {
  let profile = store["profile"].value;
  if (!profile) {
    store["profile"].value = {};
  }

  return store["profile"].value;
}

---

用例

OSM 非常適合以下場景：

• 您需要一個輕量級解決方案來進行簡單的全域狀態管理。
• 您的專案涉及必須共享全域狀態的 React 和非 React 邏輯。
• 您希望避免 Redux 或 MobX 等大型函式庫的複雜性。

---

注意：前面有一些糟糕的事情！

OSM 仍處於早期階段，尚未在所有環境中進行全面測試。雖然它非常適合較小的項目和簡單的國家需求，但建議在複雜的場景中使用它時保持謹慎。如果您確實遇到任何問題，請報告它們，以便圖書館可以繼續改進。

---

為 OSM 做出貢獻

有興趣幫助 OSM 變得更出色嗎？歡迎貢獻！查看貢獻指南以開始使用。

---

保持更新

變更日誌定期更新，包含所有新的變更和改進。

---

最後的想法

Origami-State-Manager (OSM) 旨在為全域狀態管理提供一個簡單且強大的解決方案，且不會造成臃腫。透過保持最少的設定和較高的效能，OSM 使您能夠專注於建置功能，而不是與狀態複雜性作鬥爭。

嘗試一下，在您的專案中體驗 OSM 性的新水平！

立即開始使用 OSM：npm：origami-state-manager

---

以上是介紹 Origami-State-Manager (OSM)：最少樣板的輕量級狀態管理庫的詳細內容。更多資訊請關注PHP中文網其他相關文章！