import { usestate, useRef } form 'react'
import { isPlainObject } from 'lodash'
const useProxy = initData => {
const [state, serState] = useState(initData);
const handler = useRef({
get(target, key, receiver) {
const res = Reflect.get(target, key, receiver);
return isPlainObject(res) || Array.isArray(res) ? new Proxy(target[ket], handler) : res;
},
set(target,key,value){
Reflect.set(target,key,value);
setState({…target});
return true;
},
deleteProperty(target,key){
Reflect.deleteProperty(target,key);
serState({…target})
return true;
}
}).current;
const proxyData = useRef(new Proxy(state,handler)).current;
return proxyData;
}
expot default useProxy;
使用
const state = useProxy({
count: 0,
name: "hello",
arr:['lalala'],
addArr(args) {
this.arr.push(123)
},
get arrCount() {
return this.arr.length;
},
data:{
name:'word'
},
reg: /123/,
flag: true
})