中途提交表单(useEffect做法)
if(file){
await _.resume(roomToken, file)//上传简历,完成后进行下一步
ajax.fetchSata().then:setFieledsValue
}
这次的需求是这样,一个表单,想要在提交简历后就开始解析信息(而不是等到整个表单提交时再进行解析
那么可以灵活利用React的useEffect钩子,当表示简历的状态file变化时,若有简历,则发送、解析。
后续提交整个表单时,只要进行数据update即可。
useEffect中使用异步函数
刚刚那个需求,在写useEffect时,我本想用异步函数的,但是报错了:
Argument of type '() => Promise<void>' is not assignable to parameter of type 'EffectCallback'.
useRffect(async () =>{
//do sth.
})
(所以为了赶紧看到效果 先写了Promise连锁。
原因:异步函数始终返回Promise对象,
当明确return 一个数字时,这个数字会被Promise.resolve()包裹,也就是[[PromiseResult]]的值是返回的那个值。(没有明确返回就是undefined,总之是返回一个Promise啦。
那样
useRffect(async () =>{
//do sth.
})
||
/
useEffect(()=>{
//do sth.
return Promise
})
都知道useEffect体中的返回的函数是用于进行清除的,这样就会被提示这样不对。
想要使用异步:
useEffect(()=>{
async function f(){};//声明
f();//执行
})
//或者直接使用立即执行函数
useEffect(()={
//还没学晚点补……
})
保存聊天记录
需求就是刷新网页聊天记录不丢失,那就考虑使用浏览器存储来做。用sessionStorage来做的。
其实不是很难的,就是发送的信息是一个一个对象,先用JSON.stringfy()
来转成字符串,因为sessionStorage中键值对要求值是字符串,然后使用的时候用JSON.parse()
将刚刚存下来的字符串转成对象。
逻辑方面就是使用useEffect,当对话信息增加时进行setItem,当网页挂载时进行getItem,再一条一条重新append就可以了。
说一下我自己做的憨憨事,两件
第一件是觉得这是使用useEffect的清除功能的大好时机,所以把setItem放在返回函数里面。但是因为unmount太快了,每次都来不及完成Set……(如果是这样,那这个清除功能还有什么用啊
第二件是,改了逻辑,把useEffect的执行逻辑时机改成了信息变化时执行。这样就,useEffect开始疯狂执行了,因为内部的包含了改变信息的行为,就反复触发了,不一会儿浏览器就卡死了。
所以后来还是把这两个事情分开来做了。