應用程式啟動時我的資料未定義，但重繪 后資料完美。
對于啟動它給了我[未處理的承諾拒絕：TypeError：Object.entries要求輸入引數不是null或未定義]
但重繪 后，資料完美無缺，一切正常。
編輯
根據您的評論，我的錯誤有所改變，現在我更接近解決問題，您可以查看詳細資訊。我更新了整個描述
這是我資料的一部分
Object {
"attributes": Object {
"htmlName": null,
"id": 0,
"items": Array [
Object {
"htmlName": "r_1",
"name": "m2 (Brüt)",
"numeric": true,
"options": Object {},
"order": 0,
"required": true,
},
Object {
"htmlName": "r_2",
"name": "m2 (Net)",
"numeric": true,
"options": Object {},
"order": 0,
"required": true,
},
Object {
"htmlName": "r_164",
"name": "Arsa Alan? (m2)",
"numeric": true,
"options": Object {},
"order": 0,
"required": true,
},
Object {
"htmlName": "a_137",
"name": "Oda Say?s?",
"numeric": false,
"options": Object {
"12": "1 0",
"13": "1 1",
"14": "1.5 1",
"15": "2 0",
"16": "2 1",
"17": "2.5 1",
"18": "2 2",
"19": "3 1",
"20": "3.5 1",
"21": "3 2",
"22": "4 1",
"226": "0 1",
"23": "4.5 1",
"24": "4 2",
"25": "4 3",
"26": "4 4",
"27": "5 1",
"28": "5 2",
"29": "5 3",
"30": "5 4",
"31": "6 1",
"32": "6 2",
"33": "6 3",
"34": "7 1",
"35": "7 2",
"36": "7 3",
"37": "8 1",
"38": "8 2",
"39": "8 3",
"40": "8 4",
"41": "9 1",
"42": "9 2",
"43": "9 3",
"44": "9 4",
"45": "9 5",
"46": "9 6",
"47": "10 1",
"48": "10 2",
"49": "10 üzeri",
},
"order": 0,
"required": true,
},
api.js
export const getData = async function (setData) {
await axios
.get(
"urlblabla",
{
headers: {
Authorization: `authblabla`,
},
}
)
.then((json) => {
if (json && json.status === 200) {
setData(json.data);
}
})
.catch((e) => {
console.log(e);
});
};
應用程式.js
const [data, setData] = useState([]);
const [roomValue, setRoomValue] = useState(null);
const [roomCount, setRoomCount] = useState([]);
const [isFocus, setIsFocus] = useState(false);
useEffect(() => {
getDataFunc();
setDropdown(data.attributes?.items[3].options);
}, []);
const getDataFunc = async () => {
await getData(setData);
};
function setDropdown(query) {
const response = query;
try {
const entries = Object.entries(response);
const tempArray = [];
for (let i = 0; i < entries.length; i ) {
var key;
var value;
(key = entries[i][0]), (value = entries[i][1]);
tempArray.push({ key: value, value: key });
}
setRoomCount(tempArray);
console.log(roomCount);
} catch (error) {
console.log(error);
}
}
我該如何解決？
uj5u.com熱心網友回復：
在我看來，你data.attributes的undefined有價值。請仔細檢查所有內容，如果是，從技術上講不可能直接獲取data.attributes資料undefined
uj5u.com熱心網友回復：
似乎錯誤是由于您嘗試訪問它時屬性屬性為空而引起的。但是，當您一一分配它們時，它會加載，因為資料是在將資料分配給變數之前按嵌套屬性加載的。表示尚未完全加載
const response = data.attributes.items[3].options;
它輸出錯誤，因為屬性未定義。所以它不是一個物件，因此， attributes.items 被認為是無效的
// sample
const data = {
/* attributes: {
items: {
1: {
options: 'option1'
},
2: {
options: 'option2'
},
3: {
options: 'option3'
}
}
} */
}
const specificData = data.attributes.items[3].options
console.log(specificData) // 因此，一種解決方案是使用可選鏈接運算子來避免錯誤，它基本上只是question mark (?)在您嘗試訪問的物件之后。
回應將是' undefined'。這樣，即使attributes為空或不為空，資料也將分配給回應常量，然后您可以在此之外添加更多檢查。
// sample
const data = {
/* attributes: {
items: {
1: {
options: 'option1'
},
2: {
options: 'option2'
},
3: {
options: 'option3'
}
}
} */
}
const specificData = data.attributes?.items[3].options
console.log(specificData) // outputs undefined instead of an error讓我知道這是否可行。也許您可以提供實際的 api 或示例 api 端點，以便我們可以直接對其進行測驗。或者也許是完整的代碼？
盡管我不是 100% 確定這就是我所做的一切，但我之前已經遇到過這個問題。但是對于錯誤，我確信可選的鏈接運算子會阻止它
uj5u.com熱心網友回復：
嘗試在異步函式中呼叫 getData 并等待該程序在您的App.js中像這樣完成
const [data, setData] = useState([]);
const [roomCount, setRoomCount] = useState([]);
useEffect(() => {
getDataFunc()
}, []);
const getDataFunc = async() => {
await getData(setData);
const response = data;
console.log(response);
const entries = Object.entries(response);
const tempArray = [];
for (let i = 0; i < entries.length; i ) {
var key;
var value;
(key = entries[i][0]), (value = entries[i][1]);
tempArray.push({ key: value, value: key });
}
setRoomCount(tempArray);
console.log(roomCount);
}
注意：最好的做法是不要直接將 setData 函式傳遞給 getData api 呼叫，而是從 api 回傳回應并在主代碼中分配回應，如下所示
const response = await getData();
setData(response)
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/526837.html