从api获取JSON列表数据 [英] Fetch JSON list data from api

问题描述

我正在尝试从返回如下格式的json的端点中获取问题列表:

[
  {
    "id": 1,
    "question": "text",
    "option1": "text",
    "option2": "text",
    "option3": "text",
    "option4": "text",
    "answer": "text"
  },
  {
    "id": 2,
    "question": "text",
    "option1": "text",
    "option2": "text",
    "option3": "text",
    "option4": "text",
    "answer": "text"
  }
]

在示例此处之后，我有一个测验类:

class Quiz extends Object with _$QuizSerializerMixin {
  List<Question> questions;

  Quiz(this.questions);

  factory Quiz.fromJson(Map<String, dynamic> json) => _$QuizFromJson(json);
}

和问题类别:

class Question extends Object with _$QuestionSerializerMixin {

  final String question;
  final String option1;
  final String option2;
  final String option3;
  final String option4;
  final String answer;

  Question(
      {this.question,
      this.option1,
      this.option2,
      this.option3,
      this.option4,
      this.answer});

  factory Question.fromJson(Map<String, dynamic> json) =>
      _$QuestionFromJson(json);
}

，其功能定义为:

Future<Quiz> fetchQuiz() async {
  final response = await http.get('json_endpoint.placeholder/questions');

  if (response.statusCode == 200) {
    return Quiz.fromJson(json.decode(response.body));
  } else {
    throw Exception('Failed to load quiz');
  }
}

如何将其传递给新的测验实例?这可能很明显，但我发现很难.

我尝试如下声明变量:

class QuizScreen extends StatefulWidget {
  @override
  _QuizScreenState createState() => _QuizScreenState();
}

class _QuizScreenState extends State<QuizScreen> {
Question question
String option1
...

Quiz quiz = quiz(fetchQuiz());

@override
void initState() {
super.initState();
question = quiz.nextQuestion;
option1 = question.option1;
...

Quiz quiz = Quiz(fetchQuiz());引发错误.

解决方案

代码应类似于

Future foo() async {
  Quiz quiz = await fetchQuiz();
} 

fetchQuiz()返回一个Future<Quiz>，要获取该值，请使用await，因为需要将包含代码(在我的示例中为foo())的函数设置为async.

I am trying to fetch a list of questions from an endpoint that returns json formatted like so:

[
  {
    "id": 1,
    "question": "text",
    "option1": "text",
    "option2": "text",
    "option3": "text",
    "option4": "text",
    "answer": "text"
  },
  {
    "id": 2,
    "question": "text",
    "option1": "text",
    "option2": "text",
    "option3": "text",
    "option4": "text",
    "answer": "text"
  }
]

Following the example here, I have a quiz class:

class Quiz extends Object with _$QuizSerializerMixin {
  List<Question> questions;

  Quiz(this.questions);

  factory Quiz.fromJson(Map<String, dynamic> json) => _$QuizFromJson(json);
}

and question class:

class Question extends Object with _$QuestionSerializerMixin {

  final String question;
  final String option1;
  final String option2;
  final String option3;
  final String option4;
  final String answer;

  Question(
      {this.question,
      this.option1,
      this.option2,
      this.option3,
      this.option4,
      this.answer});

  factory Question.fromJson(Map<String, dynamic> json) =>
      _$QuestionFromJson(json);
}

with the function defined as:

Future<Quiz> fetchQuiz() async {
  final response = await http.get('json_endpoint.placeholder/questions');

  if (response.statusCode == 200) {
    return Quiz.fromJson(json.decode(response.body));
  } else {
    throw Exception('Failed to load quiz');
  }
}

how do I pass this into a new instance of quiz? This may be obvious but I am finding it difficult.

I have tried declaring a variable as follows:

class QuizScreen extends StatefulWidget {
  @override
  _QuizScreenState createState() => _QuizScreenState();
}

class _QuizScreenState extends State<QuizScreen> {
Question question
String option1
...

Quiz quiz = quiz(fetchQuiz());

@override
void initState() {
super.initState();
question = quiz.nextQuestion;
option1 = question.option1;
...

Quiz quiz = Quiz(fetchQuiz()); throws an error.

解决方案

The code should look like

Future foo() async {
  Quiz quiz = await fetchQuiz();
} 

fetchQuiz() returns a Future<Quiz> and to get the value out, you use await, for that the function that contains the code (foo() in my example) needs to be made async.

这篇关于从api获取JSON列表数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！