常见异步操作进行同步处理

常见异步操作进行同步处理

async…await… 与 promise

在使用async和await进行将异步改成同步处理时， 所使用的函数返回的值必须是返回的promise对象的数据，否则不会达到异步改成同步操作的处理
实操代码：

const Func = ()=>{
	return new Promise<any>(async (resolve, reject) => {
      // 最外层
      try {
	      let data = 'promise'
	        resolve(data)
      } catch (e) {
        	reject(e);
      }
    });
}
const Func2 =(data)=>{
	console.log(data)
}
const getData = async()=>{
	const res = await Func()
	Func2 (res)
}

注意：在实际中，忽视了上一个函数需必须返回的是promise数据，自以为两个函数只要用了async…await…就可以实现异步同步处理，即使你下一个函数不用的上一函数的数据，要实现异步进行同步处理，上一个函数还是要返回promise数据。

react中this.state

在react中在修改state数据后，同步某个函数使用修改的数据或者是在修改完state中的数据再调用某个函数，可进行如下处理：

...在react页面中
func1 = ()=>{
	console.log(this.state.data)
}
func = ()=>{
	let data = '12'
	this.state({
		data：data
	},()=>{
		this.func1()
	)
}

react-hooks中的useState

在react-hooks中在useState使用修改数据后，同步某个函数使用修改的数据或者是在修改完state中的数据再调用某个函数，可进行如下处理：

const [data,setData] = useState('')
const func1 =(value)=>{
	console.log(value)
}
const func= ()=>{
	const dataRe = "goods"
	setData((val)=>{
		func1(val)
		return dataRe ;// 是data没有修改前的数据，进行return dataRe 后，就修改data数据了
	})
}

在使用 上修改函数时 必须有return返回数据，如果不是修改data数据，只是想使用最新data数据（在其他函数中被修改），可直接返回val 即可