问答

React 中怎么不通过 Hooks 使用 Promise 异步方法赋值?

作者:admin 2021-04-19 我要评论

目前使用的方法都是通过 Hooks 来调用异步方法赋值如: ...const [dataSource, setDataSource] = useState();...useEffect(() = { R_Resource_Select(routerPara...

在说正事之前,我要推荐一个福利:你还在原价购买阿里云、腾讯云、华为云服务器吗?那太亏啦!来这里,新购、升级、续费都打折,能够为您省60%的钱呢!2核4G企业级云服务器低至69元/年,点击进去看看吧>>>)

目前使用的方法都是通过 Hooks 来调用异步方法赋值如:

...
const [dataSource, setDataSource] = useState();
...
useEffect(() => {
  R_Resource_Select(routerParams.builder).then(function(data) {
    setDataSource(data.Data);
  })
}, [routerParams]);

但是有的值不要监控不需要变化我不想用 Hooks 这时候就不会写了老是报错:

// 这样写返回的是 Promise
const treeData = R_Builder_Tree().then(function(data) {
   return data;
  });
  console.log(treeData);
// 或者
const treeData = R_Builder_Tree();

都不行老是返回 Promise,求教我应该怎么改

###

首先 你调用的接口 返回值就是一个promise。

那么如果你要拿到接口的值 无非就是 async/await 或者 promise.then 来获取数据。

再其次 你应该使用的函数组件,函数组件在没有hooks的时候 一直都是无状态组件,他只负责渲染从其他组件传递过来的数据,自身并不能 带有状态。

如果你想在函数组件中,通过调用接口的方式去获取数据,并展示出来,所以react 提供了hooks的解决方案

###

首先,你可以回想下没有hooks 的时候,请求接口 你是不是需要在生命周期函数 内请求?,所以如果不需要监听值得变化,也就是这个函数只用请求一次,你可以

// [] 为空相当于 componentDidMount
useEffect(() => {
  request();
}, [])

const request = () => {
   fetch().then((res) => {
    // 完成逻辑 或者请求数据存储
   })
}
###

你只是要把响应回调数据data赋值给treeData吗? 如果是的话,看看是不是这样

let treeData
R_Builder_Tree().then(function(data) {
   treeData = data;
   console.log(treeData);
});

版权声明:本文转载自网络,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。本站转载出于传播更多优秀技术知识之目的,如有侵权请联系QQ/微信:153890879删除

相关文章
  • nginx响应速度很慢

    nginx响应速度很慢

  • 点击选中的多选框,会在已选那一栏显示

    点击选中的多选框,会在已选那一栏显示

  • PHP 多态的理解

    PHP 多态的理解

  • 关于C语言中static的问题

    关于C语言中static的问题

腾讯云代理商
海外云服务器