2024年5月23日

將 Prisma ORM 引入 React Native 和 Expo

Prisma ORM 現已為 React Native 和 Expo 提供搶先體驗(Early Access)支援,滿足了社群的普遍需求。此次整合引入了*響應式查詢*(reactive queries),利用 React Hooks 在底層資料發生變化時自動更新使用者介面(UI)。

Bringing Prisma ORM to React Native and Expo

Prisma ORM 是在後端 JavaScript 應用程式中處理資料庫的首選方式。這得益於其出色的型別安全性、簡易的遷移系統以及與您常用 IDE 的緊密整合。

早在 2019 年,我們就收到了支援 React Native 的第一個請求,此後該問題獲得了 300 多個贊。我們一直希望 Prisma 能夠為本地應用(包括移動、Web 和桌面應用)提供資料支援,因此社群的這種興趣對我們來說是理所當然的。但我們也知道,僅僅將 Prisma ORM 移植到移動端是不夠的。應用程式與 Web 伺服器不同,為了提供卓越的開發者體驗(DX),我們需要構建額外的功能,以實現與底層平臺的緊密整合。因此,我們一直在努力,今天,我們很高興地宣佈 Prisma ORM for React Native 和 Expo 的搶先體驗版正式釋出 🎉 

我們與 Expo 合作,確保它在 Expo 管理的應用程式中易於使用,並且 readme 中包含了在非 Expo 管理的 React Native 應用程式中設定 Prisma ORM 的文件。

響應式查詢

除了完整的 Prisma ORM API,我們還引入了一組新的查詢函式,它們與 React 的 Hook 機制整合,可在底層資料發生變化時自動更新您的使用者介面(UI)。我們稱之為響應式查詢,其工作原理如下

在此元件中,我們在頂部聲明瞭資料依賴。我們沒有使用 Prisma ORM 常規的 findMany() 查詢函式,而是使用了新的 useFindMany() 查詢函式,它直接與 React 的 useState()useEffect() 機制整合,以便在底層資料發生變化時重新渲染元件。

此行最初返回一個空陣列,然後在從本地資料庫獲取到事務列表後立即重新渲染元件

在 React 中,Hook 通常是獨立的函式——例如 useFindManyTransactions()。為了與常規的 Prisma ORM API 保持一致,我們選擇了替代格式 prisma.transactions.useFindMany()。在此搶先體驗期間,我們正在徵求對這一決定的反饋。請在 Discord 上分享您的想法。

LongPress 處理程式中,資料庫行被刪除,這會自動觸發元件的重新渲染。值得注意的是,資料更改可以在應用程式的任何地方發生,並且它將觸發依賴該資料的任何活動元件的重新渲染。

透過利用響應式查詢,許多應用程式可以重構,以消除脆弱的手動狀態管理,轉而採用簡單的自動化響應式模型。

今天就在您的 Expo 應用中使用 Prisma ORM

Prisma ORM 今天即可在您的 Expo 和 React Native 應用中使用。請記住這是一個搶先體驗版(Early Access),因此請幫助我們進行測試,並在 Discord 上與我們分享您的經驗。要開始使用,請按照 readme 中的說明進行操作。

本地優先實驗

我們設計了響應式查詢系統,使其將來能夠直接與完全整合的同步服務協同工作。這將使您能夠編寫使用本地資料以獲得最佳使用者體驗的應用程式,同時在後臺自動同步,從而實現即時協作、狀態指示和資料共享等強大功能。我們現在還未準備好詳細討論此內容,但您可以在此 GitHub 倉庫中檢視此概念的實驗性實現。

不要錯過下一篇文章!

訂閱 Prisma 新聞通訊

© . This site is unofficial and not affiliated with Prisma Data, Inc.