Question

我有兴趣让我的QuestionList.js组件在按下按钮时加载数据，但是我不希望它从api加载所有数据，每个屏幕只有一个对象来自这个10个对象的数组

我相信我在这里有一个操作顺序问题，我需要帮助解决。

我知道如何使用axios和componentWIllMount()从API获取数据，这将在应用启动时获取我的数据，但我不确定这是否是我想要做的因为它是一个测验应用程序。

所以我只想在用户按下按钮时获取这个对象数组。

或者我认为这一切都错了？我应该继续使用这种配置：

import React, { Component } from 'react';
import { View, Text } from 'react-native';
import axios from 'axios';

class QuestionList extends Component {
  componentWillMount() {
    axios
      .get('https://opentdb.com/api.php?amount=10&difficulty=hard&type=boolean')
      .then(response => console.log(response));
  }

  render() {
    return (
      <View>
        <Text>Question List!!!</Text>
      </View>
    );
  }
}

export default QuestionList;

哪个有效，然后在用户按下按钮时再次加载，然后在实际渲染到屏幕时再加载？

如果用户在按下按钮之前不需要数据，我是否应该使用componentWillMount()生命周期方法？

请帮忙。

Answer 1

用户体验友好的服务将在用户请求查看之前准备好所需的数据。这样，每次屏幕更改时，用户都不必等待数据加载。

如果您的数据很大，那么只请求下一个屏幕数据更合乎逻辑。这样，用户无需等待数据加载，应用程序将在启动时提前准备就绪。例如，在应用加载时加载前2项，当用户导航到第二项时加载第三项，在第三项加载第四项等等。

如果您的数据不是很大并且请求完成得非常快，那么一次性获取它们将导致对服务器的请求减少，并且性能更高，需要更少的带开关等。

这取决于您的应用程序要求和您的决定

按下按钮时反应原生加载数据

1 个答案: