ErrorException：檔案中未定義的陣列鍵“名稱”

Question

<p>我正忙於客戶管理系統，該系統還追蹤客戶訂單。我已經設定了一個 CRUD API 來處理後端資料庫資料的讀寫，但是當我嘗試將購物車資料 POST 到資料庫時，出現以下錯誤。 </p> <blockquote> <p>quote 從回應中解析 JSON 時出錯：SyntaxError: 意外的標記 '<', " 不是有效的 JSON</p> <p>接收以下內容而非有效的 JSON：<!-- ErrorException: 未定義的陣列鍵 文件中的“名稱” C:\Users\mjver\OneDrive\Documents\Coding\client-api\routes\api.php 上 第238行</p> </blockquote> <p>我已將輸入資料檢查到客戶端的 $data["name"] 陣列中，但看不到任何錯誤。我已經檢查了拼寫錯誤和拼寫錯誤以及所有這些，我希望一些新的眼睛可以提供幫助。</p> <p>我的前後端程式碼片段如下：</p> <p>呼叫api.js中的API呼叫函數：</p> <pre class="brush:php;toolbar:false;">async sendOrder(){ console.log(this.cart); const order = await APIController.CreateOrder(this.cart.name, this.cart.qty, this.cart.option, this.cart.price, this.orderNum, this.cart.fee, this.cart.date, this. id); if(order){ store.dispatch('clearCart'); } },</pre> <p>api.js 檔案中的 API 呼叫：</p> <pre class="brush:php;toolbar:false;">CreateOrder: (name, qty, option, price, orderNo, fee, date, userId) => { let responseClone; const csrfToken = document.cookie.match(/XSRF-TOKEN=([^;] )/)[1]; if( name == "" || qty == "" || option == "" || price == "" || orderNo == "" || date == "" || userId == "" ) { return false; } else { return fetch(API_BASE "/orders/create", { method: "POST", headers: { "Content-Type": "application/json", "X-CSRF-TOKEN": csrfToken }, body: JSON.stringify({ name, qty, option, price, orderNo, fee, date, userId }) }).then((response) => { responseClone = response.clone(); return response.json() }) .then(data => { if(data.success){ alert("Order created successfully!") return true; } else { throw data.response.error; } }, (rejectionReason) => { console.log('Error parsing JSON from response: ', rejectionReason, responseClone); responseClone.text() .then((bodyText) => { console.log('Receiving the following instead of valid JSON: ', bodyText); }); }).catch(err => { alert(err); }); } },</預> <p>api.php檔案中的php路由：</p>

Route::post('/orders/create', function(Request $request){
    $data = $request->all();

    if(!Orders::where('orderNo', '=', $data['orderNo'])->exists()){
        $order = 訂單::創建([
            “姓名” => $data[“名稱”],
            “數量” => $data[“數量”],
            “選項” => $data[“選項”],
            “訂單編號” => $data[“訂單號碼”],
            “用戶ID” => $data[“用戶ID”],
            “價格” => $data[“價格”],
            “費用” => $data[“費用”],
            “日期” => $data[“日期”],
        ]);

        if(空($order->id)){
            返回 [
                “成功” =>錯誤的，
                “回應” => [
                    “錯誤” => “發生了異常錯誤”
                ]
            ];
        } 別的 {
            返回 [
                “成功” =>真的，
                “回應” => [
                    “訂單” => $訂單
                ]
            ];
        }
    } 別的 {
        返回 [
            “成功” =>錯誤的，
            “回應” => [
                “錯誤” => “庫存項目已存在”
            ]
        ];
    }
});</pre>
<p>我的訂單模型文件：</p>
class Orders 擴充 Model
{
    使用 HasFactory；

    受保護的$可填充= [
        '產品'，
        '數量',
        '選項'，
        '訂單號碼'，
        '使用者身分'，
        '價格'，
        '費用'，
        '日期'，
    ];

    公函數乘積 (){
        返回 $this->hasMany(Product::class);
    }
}</pre>
<p>如果您能幫我解決這個問題，我將不勝感激，因為我已經為此苦苦掙扎了一段時間。</p>

Answer 1

我設法弄清楚了。我 console.log(this.cart.name) 並發現它是「未定義」。經過進一步調查，我發現原因是 state.cart 是一個物件數組，而不僅僅是一個物件。當然，原因是購物車中的每個單獨的商品都應該是它自己的對象。所以我的解決方案是：

for(let i = 0; i <= this.cart.length - 1; i++){
                try {
                    const order = await APIController.CreateOrder(this.cart[i].name, this.cart[i].qty, this.cart[i].option, this.cart[i].price, this.orderNum, this.cart[i].fee, this.cart[i].date, this.id);
                    if(order){
                        this.clearCart();
                    }
                } catch (error){
                    console.log(error);
                }
            }

分解：由於 this.cart 是一個陣列而不是一個對象，我必須先使用 for 迴圈來取得購物車中每個項目的索引，然後呼叫將資料發佈到資料庫的函數。