交互式愛情
2022-12-02 11:22:35
我有一個用于從數據庫中呈現用戶列表的類 export default class Users extends React.Component { constructor() { super() this.state = { data : [] //define a state } } renderUsers = () => { useEffect(() => { fetch('exemple.com') .then((response) => response.json()) .then((json) => this.setState({data: json.result})) // set returned values into the data state .catch((error) => console.error(error)) }, []); return this.state.data.map((value,key)=>{ // map state and return some views ...... }) } render() { return ( <View style={{ flex: 1 }}> {this.renderUsers()} //render results </View> ); } }問題是這段代碼會拋出以下錯誤:無效的 Hook 調用,Hooks 只能在 body 組件內部調用我認為不可能在類組件內部使用掛鉤。如果不可能,從此類內部的服務器獲取數據的最佳方法是什么?
2 回答
慕桂英4014372
TA貢獻1871條經驗 獲得超13個贊
鉤子只能用在功能組件中。
您可以將您的組件重寫為功能性組件,如下所示:
export default Users = () => {
const [data, setData] = useState([]);
useEffect(() => {
fetch('exemple.com')
.then((response) => response.json())
.then((json) => setData(json.result)) // set returned values into the data state
.catch((error) => console.error(error))
}, []);
const renderUsers = () => {
return data.map((value, key) => {
// DO STUFF HERE
})
}
return (
<View style={{ flex: 1 }}>
{renderUsers()} //render results
</View>
)
}
添加回答
舉報
0/150
提交
取消
