react native如何更新组件信息？

Question

I'm consuming the data from this api, using useEffect. What I want, is that every time the data changes in the API. Change component information

const [infoUser, setInfoUser] = useState([]);
const getInfoUser = async () => {
    try {
      const accessToken = await AsyncStorage.getItem('@access_token');

      axios
        .get(
          'https://apiexample.com/cliete',
          {
            headers: { Authorization: `Bearer ${accessToken}` },
          },
        )
        .then(function (response) {
          // handle success
          console.log('DADOS USER:', response.data.data);
          const userData = response.data.data;

          setInfoUser([...infoUser, userData]);
        })
        .catch(function (error) {
          // handle error
          console.log(error);
        });
    } catch (e) {
      // error reading value
      console.log('Erro de token', e);
    }
  };

  useEffect(() => {
    getInfoUser();
  }, []);

On another screen, I change the data and save.

But the previous screen has not been updated. The data only changes when I log out and enter the app again

{infoUser.map(user => (
            <Text style={styles.subtitle}>Nome Completo</Text>
            <Text style={styles.title}>{user.nomeCompleto}</Text>
          </TouchableOpacity>
        ))}

Answer 1

If you pass variables/functions to useEffect array of dependencies, and they are changing, it will trigger your useEffect . So if you want to depend on some data you can write it like this:

useEffect(() => {
  getInfoUser();
}, [data]);

Every time data is updated useEffect will be called by React.