Fetch数据的问题

#1

不知道是不是自己操作的问题,所以想问下.

# Until.js
var customers = {
    all() {
        fetch(`${URL}/customers`)
            .then(resp => resp.json())
            .then(data => data )
            .catch(err => {
                console.log("fetch error" + err);
            });
    }
}
export default customers

这里是想在组件里调用all方法.得到的结果却是undefined.
不知道是操作有问题还是这样的想法就是错误的.
欢迎指正,谢谢.

ps: 这个undefined没有解决,目前是暂时放在componentDidMount里解决的.

#2

异步啊，要拿到fetch的内容显然要在第二个then里
推荐async/await

#3

那我再看看，那么麻烦呐。

#4

是所有的都需要这样吗?
有没有差不多的例子可以参考下呀,

#5

js回调地狱，最好的当然是es7的async,await
当然最快的方法是传函数进去，在函数里写后面的代码
all(func) {
fetch(${URL}/customers)
.then(resp => resp.json())
.then(func)
.catch(err => {
console.log(“fetch error” + err);
});
}

#6

可以说的再明白些吗?
还是不怎么懂,传递函数进去是指?
我目前是想要这个all方法返回一个result给我.

#7

把所有涉及异步的函数都用async/await改造才能return value这种。
传递函数进去是指
all(func) {
fetch(${URL}/customers)
.then(resp => resp.json())
.then(func)
.catch(err => {
console.log(“fetch error” + err);
});
}
然后在调用的地方定义func函数，调用的时候把func传进all, all(func)这种，当然实际情况应该还要传url,method,params这些参数

#9

非常感谢你的回复,可我还是不懂,惭愧.

我在列表里遍历这个result.所以只是在render的时候调用这个all()方法去遍历.

不知道是否有这种例子可以参考一下.

#10

先去了解下js异步打基础吧

#11

似乎也只能只有了 :joy:

#12

要看你fetch的数据类型，要是返回字符串data就是undefined,要改成resp => resp.text()

#13

var customers = {
all() {
return fetch(${URL}/customers)
.then(resp => resp.json())
.then(data => data )
.catch(err => {
console.log(“fetch error” + err);
});
}
}
export default customers

把fetch return出去。然后调用的时候 customers.all().then(res => {console.log(res)})。 这样你试试

#15

这个我到时试试,我之前外部尝试return,是不可以.也是undefined貌似.

#16

的确是不行,customers.all()传过来的是一个promise对象.

#17

异步问题。。。

#18

刚学前端,这个这个过段时间再去学,目前是把方法老老实实的写在方法里.没有去dry.