javascript - UncaughtTypeError products.map 不是函数

Question

product.map 不是一个函数，我已经尝试了几乎所有来自网络的修复仍然不起作用。另外，我尝试过 console.log(response.data) 并且它响应成功

react 版本7.0

constructor () {
        super()
        this.state = {
          products: []
        };
      }
  componentDidMount(){
         axios.get('http://localhost:8000/api/v1/products/1')
         .then(response => {
           this.setState({ products: response.data });
         })
         .catch(function (error) {
           console.log(error);
         })
       }
  render(){
   var { products } = this.state;
    var merk = products.map(products =>  {products.merk} );

出现错误 products.map 不是 var merk=..... 的函数

谢谢。

控制台日志:

{success: true, data: Array(1), message: "Phone retrieved Successfully.."}
data: Array(1)
0: {id_product: 1, merk: "Xiaomi ", tipe: "Mi Note 10", soc_nama: "Qualcomm", soc_tipe: "Snapdragon 855+", …}
length: 1
__proto__: Array(0)
message: "Phone retrieved Successfully.."
success: true
__proto__: Object

Answer 1

products.map 不是函数，这意味着 products 不是数组

在 componentDidMount 的 API 中，您必须访问从服务器返回的数据。您访问 response.data，这意味着您只访问 XMLHttpRequest 的数据，而不是 API 的数据。

尝试console.log(response.data)，看看哪一个是你想从服务器获取的数组数据