我嘗試使用背景關系來全域訪問狀態，但出現以下錯誤：
TypeError: Invalid attempt to destructure non-iterable instance.
In order to be iterable, non-array objects must have a [Symbol.iterator]() method.
我試圖通過從這個Stack Overflow Question調整背景關系的使用來解決這個問題。
我想從中獲取狀態的檔案：
const test = () => {
const [selectedValueRound, setSelectedValueRound] = useState("10 rounds");
return (
<View>
<RoundContext.Provider
value={[selectedValueRound, setSelectedValueRound]}
>
<View>
<Picker
selectedValue={selectedValueRound}
onValueChange={(itemValue, itemIndex) =>
setSelectedValueRound(itemValue)
}
>
<Picker.Item label="1 round" value="0"></Picker.Item>
<Picker.Item label="2 rounds" value="1"></Picker.Item>
</Picker>
</View>
</RoundContext.Provider>
</View>
);
};
背景關系檔案：
export const RoundContext = createContext(false);
我嘗試呼叫背景關系并出現錯誤的檔案：
const SomeFile = () => {
const [selectedValueRound, setSelectedValueRound] = useContext(RoundContext);
return (
<View>
<Text>{selectedValueRound}</Text>
</View>
);
};
export default SomeFile;
uj5u.com熱心網友回復：
為了使它起作用，請確保您 wrap SomeFileinside RoundContext.Provider，因為現在看來您沒有這樣做。
只有提供者內部的包裝組件才能使用背景關系。
另外，確保每個 React 組件都以大寫字母開頭，Test而不是test
const Test = () => {
const [selectedValueRound, setSelectedValueRound] = useState("10 rounds");
return (
<View>
<RoundContext.Provider
value={[selectedValueRound, setSelectedValueRound]}
>
<View>
<Picker
selectedValue={selectedValueRound}
onValueChange={(itemValue, itemIndex) =>
setSelectedValueRound(itemValue)
}
>
<Picker.Item label="1 round" value="0"></Picker.Item>
<Picker.Item label="2 rounds" value="1"></Picker.Item>
</Picker>
</View>
<SomeFile/>
</RoundContext.Provider>
</View>
);
};
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/477993.html
標籤：javascript 反应 反应式
上一篇：重心有理插值