异步函数未列出任何内容

Question

我需要在此页面中列出一些用户，但它不起作用

导出默认类 Dermatologistas 扩展组件{ 状态 ={ 错误消息：空， 用户：[] }

  getUserList = async () => {
    console.log('ok1')

这里控制台日志正常

    try {
      const response = await api.get('/projects/list');

但是这里什么都没有发生

      const { users } = response.data
      console.log(response.data)
      console.log('ok')
      this.setState({ users });
     
    } catch (response) {
      this.setState({ errorMessage: response.data.error });
    }
  };

你可以看到我在这里调用我的函数

  componentDidMount(){
    this.getUserList()
  }

  render(){
    const users = this.state.users
    console.log(users)
    return(
      <View >
        { this.state.errorMessage && <Text>{ this.state.errorMessage }</Text> }
        {this.state.users.filter(user => user.speciality === 'Dermatologista').map(user => (
          <View key={user._id} style={{marginTop: 15, alignItems: 'center'}}>
            <Text style={{fontWeight: 'bold', fontSize:20}}>{user.title}</Text>
            <Text>{user.speciality}</Text>
            <Button   title = 'View Profile'onPress ={() => 
               this.props.navigation.navigate('Profile')}/>
            </View>
        ))}
      </View>
    )
  }
}

Answer 1

试试useEffect()和useState()

componentDidMount、componentDidUpdate等的使用已经过时了。

你现在可以试试这个

import React,{useState, useEffect} from 'react';

const YourComponent = () => {
  
  const [users, setUsers] = useState([]);

  useEffect(() => {
    console.log('ok1')
    api.get('/projects/list').then((response) => {
      setUsers(response.data);
      console.log(response.data);
      console.log('ok');
    });
  }, []);
 
  return(
   <YourJsxComponents />
  );
};

OBS:默认useEffect已经是一个异步函数