小甜甜雖好，但誰不愛紫霞仙子呢？Redux雖好，但還有Valtio！

React中的狀態(tài)管理是開發(fā)人員需要解決的問題。 總有一些新庫給你選擇，而選擇合適的庫可能是一項(xiàng)困難的工作

狀態(tài)管理一直是React中開發(fā)人員需要解決的問題，如何有條理的組織數(shù)據(jù)，如何快速的在項(xiàng)目中集成，這些都是我們做項(xiàng)目時(shí)選擇技術(shù)的標(biāo)準(zhǔn)。

Redux一直是我們r(jià)eact項(xiàng)目中不二的狀態(tài)管理插件，但是redux的配置以及各種插件的安裝一直是很多人員頭疼的一個(gè)問題，太麻煩了。但是隨著ReduxToolkit的出現(xiàn)，確實(shí)解決了這個(gè)問題，直接安裝，就不再需要繼續(xù)安裝各類其他插件，直接上手就能用，簡(jiǎn)單方便。但是很多時(shí)候，我們的項(xiàng)目可能根本不需要這么笨重的插件，雖然redux很好，但是畢竟這么多年過去了，一代新人換舊人。前端這個(gè)大坑中，總會(huì)出現(xiàn)新的技術(shù)、框架來埋葬那些老家伙。

代理

Proxy對(duì)象用于創(chuàng)建一個(gè)對(duì)象的代理，從而實(shí)現(xiàn)基本操作的攔截和自定義（如屬性查找、賦值、枚舉、函數(shù)調(diào)用等）。

自ES6版本以來，我們?cè)贘avaScript中有代理。 ?代理接收兩個(gè)參數(shù)：

• target?- 要代理的原始對(duì)象

• handler?- 定義對(duì)象的操作

這是我們?nèi)绾问褂肑avaScript創(chuàng)建代理的方式：

Valtio

Valtio是一個(gè)用于對(duì)React和JavaScript應(yīng)用程序簡(jiǎn)單的代理狀態(tài)的庫。它使用了js中Proxy這個(gè)語法，能讓我們可以非常方便的在react中集成狀態(tài)管理功能。

我們需要做的是包裝我們的狀態(tài)對(duì)象，然后我們可以在我們的應(yīng)用程序中的任何地方進(jìn)行改變:

定義好的數(shù)據(jù)直接在組件中進(jìn)行引入就能使用，useSnapshot可以獲取我們定義好的狀態(tài)數(shù)據(jù)，使用之后在組件中就是一個(gè)響應(yīng)式的效果，只要數(shù)據(jù)改變了組件就會(huì)直接進(jìn)行更新

valtio簡(jiǎn)單直接，充分使用了proxy這個(gè)對(duì)象，簡(jiǎn)單粗暴的實(shí)現(xiàn)react項(xiàng)目的狀態(tài)管理。在一些小型項(xiàng)目中是一個(gè)不錯(cuò)的選擇。當(dāng)然當(dāng)然大家還是需要在項(xiàng)目中努力做好自己代碼結(jié)構(gòu)的組織方便后去數(shù)據(jù)的維護(hù)。

store，目錄存儲(chǔ)valtio的數(shù)據(jù)。index.ts做為入口，可以引入其他的子節(jié)點(diǎn)數(shù)據(jù)

store/features，目錄可以根據(jù)功能做拆分處理。每一個(gè)功能對(duì)應(yīng)一個(gè)文件

比如此處我的movie.ts文件的內(nèi)容如下

完成的store/index.ts文件如下

而我組件中如果要獲取數(shù)據(jù)，可以直接拿來用