我試圖在我的頁面中加載這個 json 但 foreach 中斷并給出錯誤,因為數字不是串行的
如果我們提供序列號,它就可以作業。串行意味著增量這是我的json
{
"": {
"id": "",
"name": "",
"reply": "",
"parent": "",
"actions": []
},
"0": {
"id": "0",
"name": "",
"reply": "",
"parent": "",
"actions": [
"01",
"02",
"03",
"04",
"06",
"07"
]
},
"01": {
"id": "01",
"name": "Order Status",
"reply": "Please provide your order number",
"parent": "0",
"actions": [
"011"
]
},
"07": {
"id": "07",
"name": "Book Appointment",
"reply": "Book Appoinme",
"parent": "0",
"actions": []
},
"welcomeMssg": "Do you need help with :-",
"startId": "0",
"scName": "test name"
}
這是我的 javascript
var scenario = "";
var fdata = null;
function getScenarioData(scid, cid) {
scenario = scid;
var obj = {
client: cid,
scenario: scid,
};
$.ajax({
type: "GET",
url: "getdata.php",
data: obj,
success: function (data) {
data = JSON.parse(data);
fdata = data;
console.log(fdata);
document.getElementById("welcomeMessage").value = data.welcomeMssg;
document.getElementById("scenarioName").value = data.scName;
scenarioName = data.scName;
welcomeMessage = data.welcomeMssg;
start = data.startId;
buttons = data;
document.getElementById("main1").style.display = "block";
document.getElementById("entry").style.display = "none";
ac = buttons[start].actions;
for(let k in buttons) {
if(buttons[k].actions){
count[k] = buttons[k].actions.length 1;
}
}
console.log(count);
ac.forEach(e => {
var input = document.createElement("input");
input.type = "text";
input.className = "replybox m-1 p-2 form-control";
input.placeholder = "reply";
input.style.display = "inline";
input.value = buttons[e].name;
input.id = buttons[e].id;
var id = buttons[e].id;
input.onclick = function () {
addRes(id, buttons[e].parent);
};
// input.onkeyup = function () {
input.onchange = function () {
buttons[id].name = document.getElementById(id).value;
if (document.getElementById("show" id)) {
document.getElementById("show" id).innerHTML =
"(for " document.getElementById(id).value ")";
}
};
var d = document.createElement("div");
var s = document.createElement("span");
d.id = "reply" id;
s.innerHTML = `<i class='fa fa-times-circle circle' aria-hidden='true' onclick='deleteButton("${id}");' style='font-size:15px;cursor:pointer;margin-left:-10px;;'></i>`;
d.appendChild(input);
d.appendChild(s);
document.getElementById("replies0").appendChild(d);
});
},
error: function (e) {
console.log(e.message);
},
});
}
如果我將 json 輸出更改為 2 而不是 7 它作業正常。我很困惑,如果我們使用 foreach,是否必須有增量資料
當我說如果我用 2 替換 7 意味著這個
"07": {
"id": "07",
"name": "Book Appointment",
"reply": "Book Appoinme",
"parent": "0",
"actions": []
},
這是演示的實時站點 https://way2enjoy.com/shopify/1/whatsapp-chat/bot/1/2/edit_scenario.php?client=50457
任何幫助都會很棒
我在控制臺收到此錯誤
Uncaught TypeError: Cannot read properties of undefined (reading 'name')
at edit_scenario.js:39
at Array.forEach (<anonymous>)
at Object.success (edit_scenario.js:33)
at c (jquery.min.js:2)
at Object.fireWith [as resolveWith] (jquery.min.js:2)
at l (jquery.min.js:2)
at XMLHttpRequest.<anonymous> (jquery.min.js:2)
uj5u.com熱心網友回復:
您正在回圈["01", "02", "03", "04", "06", "07"]并嘗試訪問回傳物件上的每個鍵。然而data["02"]、data["03"]等不存在,因此導致undefined。
ac.forEach(e => { // … input.value = buttons[e].name; input.id = buttons[e].id; var id = buttons[e].id; input.onclick = function () { addRes(id, buttons[e].parent); }; // … });
在上面的代碼中ac是指buttons[start].actions或簡單地說buttons["0"].actions是["01", "02", "03", "04", "06", "07"].
然后開始迭代這些操作,嘗試使用每個元素作為訪問物件的鍵。buttons[e]是buttons["01"]、buttons["02"]等。由于您只有密鑰"01"和"07"禮物,因此所有其他嘗試都將導致undefined。
這會產生錯誤,因為buttons[e].name-> buttons["02"].name-> undefined.name-> “未捕獲的型別錯誤:無法讀取未定義的屬性(讀取 'name')”。
這可以通過三種方式解決。其中兩個是服務器的責任。
客戶端解決方案:如果元素不存在于物件中,則跳過這些元素。
// Only select the actions that are actually present in `buttons`. ac = buttons[start].actions.filter(e => e in buttons);或者:
ac.forEach(e => { // Skip the iteration if `e` is not present in `buttons`. if (!(e in buttons)) return; // … });服務器端解決方案 1:僅將回應中實際存在的操作發送到客戶端。
{ // … "0": { "id": "0", "name": "", "reply": "", "parent": "", "actions": ["01", "07"] }, // … }服務器端解決方案 2:您還可以發送所有相關物件,而不是減少操作。
{ // … "0": { // … "actions": ["01", "02", "03", "04", "06", "07"] }, "01": { /* … */ }, "02": { /* … */ }, "03": { /* … */ }, "04": { /* … */ }, "05": { /* … */ }, "06": { /* … */ }, "07": { /* … */ }, // … }
轉載請註明出處,本文鏈接:https://www.uj5u.com/shujuku/399086.html
標籤:javascript
