Reducer(useReducer)

Ab isme bhi do arguments hote hai pehle ek function hota hai or dusre mai default values hoti hai hmare case mai ye ek object hoga jisme saari fields ki value aa rhi hogi

ab jo pehla argument hai us function mai by default do values aati hai


const [formReducer,setFormReducer]=useReducer(Myfunction,{title:"Enter the title",date:'',amount:"350"})}

// is function ko main function k bahar define karna hoga
myFuntion=(latestState,action)=>{
// ab yaha par hame condition daalni hai ki kya 
if(action.type==="title"){
			return{...latestState,title:action.val}
}
else if ().....like that
}


//and the action we can provide by calling the function in the onchangeHandeler

// if use Title has an onchangeHandeler called titleChangeHandeler

titleChangeHandeler=(events)=>{
setFormReducer({type:"title",val:events.target.value})
}

isi tarah ham reducer ki help se bina Usestate use kiye bahut saare states ko manage kar skte hai

Object destructering

jab hme kisi object ki kisi ek value ko use karna hai with some consition like ( useeffect mai ya use state mai ) then we use object destructering

basically hm object ki us value ko kisi or name se assign kar dete hai or usse use kar skte hai


const [form,formReducer]=useReducer(formReducerFn,{userTitle:"This is use title",date:"22-04-22",amount:"450"});

ab yaha par usereducer ka use karke hm form ki saari values ko update kar rhe hai na ki usestate ka use karke to yaha par agar hme koi validation lagana ho on usertitle to hm usertitle ko object mai se destruct karege


const {userTitle: titlteReducer}=formReducer // formReducer is an object containg all the 
// latest values of the state on that time in the form