React Native如何向CodeIgniter 4后端传递数组并存储至数据库

我来帮你搞定这个问题！核心问题是后端没有正确接收到你从React Native发送的数组数据，才会抛出foreach() argument must be of type array|object, null given这个错误。下面分前后端两部分调整，就能解决问题：

一、React Native 端（apisauce 发送数据调整） #

你需要确保请求以JSON格式发送，并且正确包裹数组数据。这里是修改后的代码示例：

import { create } from 'apisauce';

// 初始化apisauce实例
const api = create({
  baseURL: '你的后端API完整地址', // 比如 http://your-domain.com/api/save-couples
  headers: {
    'Content-Type': 'application/json', // 关键：告诉后端我们发的是JSON格式
  },
});

// 你的state中的数组数据
const myData = [
  { "name": "king", "meet_date": "2022-6-25 18:37", "buy_fk": "17" },
  { "name": "prince", "meet_date": "2022-6-25 18:37", "buy_fk": "18" },
  { "name": "queen", "meet_date": "2022-6-25 18:37", "buy_fk": "19" },
];

// 发送数据的异步函数
const sendCoupleData = async () => {
  try {
    const response = await api.post('/', {
      mydata: myData // 把数组放在mydata字段下，和后端接收的key对应
    });
    
    if (response.ok) {
      console.log('数据发送成功！');
      // 这里可以做后续处理，比如更新state提示用户
    } else {
      console.error('发送失败:', response.problem);
    }
  } catch (err) {
    console.error('请求出错:', err);
  }
};

// 调用函数发送数据
sendCoupleData();

二、CodeIgniter 4 后端（接收数据调整） #

因为前端发的是JSON格式的请求体，用getVar()无法正确解析，需要改用getJSON()方法。另外你之前的代码还有个小bug：foreach循环里的变量名写错了（$values定义的，却用$value），一起修正：

<?php

namespace App\Controllers\API;

use CodeIgniter\RESTful\ResourceController;

class CoupleController extends ResourceController
{
    public function saveData()
    {
        // 解析JSON请求体，转为关联数组
        $requestBody = $this->request->getJSON(true);
        
        // 取出mydata数组，用??设置默认空数组防止null
        $couple = $requestBody['mydata'] ?? [];
        
        // 先校验数据是否有效
        if (!empty($couple) && is_array($couple)) {
            // 循环处理每个数据项
            foreach ($couple as $value) { // 这里修正了变量名
                // 示例：打印每个数据项（测试用）
                // print_r($value);
                
                // 存储到数据库（假设你有一个名为couples的表）
                $insertData = [
                    'name' => $value['name'],
                    'meet_date' => $value['meet_date'],
                    'buy_fk' => $value['buy_fk']
                ];
                
                // 执行插入
                $this->db->table('couples')->insert($insertData);
            }
            
            // 返回成功响应
            return $this->response->setJSON([
                'status' => 'success',
                'message' => '所有数据已成功存储'
            ]);
        } else {
            // 返回错误响应
            return $this->response->setJSON([
                'status' => 'error',
                'message' => '未接收到有效数组数据'
            ])->setStatusCode(400);
        }
    }
}

三、关键注意点 #

1. Content-Type 必须匹配：前端设置Content-Type: application/json，后端用getJSON()解析，这是配对的核心。
2. 变量名一致性：前端发送的字段名是mydata，后端要对应取这个key，不能写错。
3. 数据校验：后端先判断数组是否有效（非空且是数组类型），避免再次出现foreach的错误。

这样调整后，你就能成功把React Native中的数组数据传递到CodeIgniter 4后端，并且存储到数据库里了。

内容的提问来源于stack exchange，提问作者Rahul Gupta