Question

我是BloC Pattern的新手。我正在向天气API发送请求，它返回一个JSON结果，如下所示。 As you can see the result is array of json object

我在响应类中将其格式化为天气模型。

天气模型课程

class Weather {
  String date;
  String day;
  String icon;
  String description;
  String status;
  String degree;
  String min;
  String max;
  String night;
  String humidity;

  Weather({this.date, this.day, this.icon, this.description, this.status,
      this.degree, this.min, this.max, this.night, this.humidity});

  Weather.init(this.date, this.day, this.icon);

  factory Weather.fromJson(Map<String, dynamic> json){
    return Weather(
      date: json['date'] as String,
      day:  json['day'] as String,
      icon: json['icon'] as String,
      description: json['description'] as String,
      status: json['status'] as String,
      degree: json['degree'] as String,
      min: json['min'] as String,
      max: json['max'] as String,
      night: json['night'] as String,
      humidity: json['humidity'] as String,
    );
  }

响应类别

class WeatherResponse {
  bool success;
  String city;
  List<Weather> result;

  WeatherResponse({this.success, this.city, this.result});

  factory WeatherResponse.fromJson(Map<String, dynamic> json) {
    var weathersFromJson = json['result'] as List<dynamic>;
    List<Weather> weatherList = List<Weather>();
    weathersFromJson.forEach((element) {
      Weather weather = Weather.fromJson(element);
      weatherList.add(weather);
    });

    return WeatherResponse(
      success: json['success'] as bool,
      city:  json['city'] as String,
      result: weatherList
    );

  }
}

天气集团

enum WeatherEvent { getWeather, getDetails }

class WeatherBloc extends Bloc<WeatherEvent, Weather> {
  WeatherBloc(Weather initialState) : super(initialState);

  @override
  Stream<Weather> mapEventToState(WeatherEvent event) async*{
    switch (event) {
      case WeatherEvent.getWeather:
        WeatherRequest().fetchWeathers().then((weatherResponse) =>
          weatherResponse.result.forEach((element) {
            return element;
          })
        );
        break;

      case WeatherEvent.getDetails:
        break;
    }
  }
}

我想使用yield而不是return元素，并且当数据到来时，我想将此数据天气列表结果元素发送到UI。

UI Bloc Builder

 BlocBuilder<WeatherBloc, Weather>(
            builder: (context, result) {
              print(result.date);
              return (Text(result.date));
            },
          ),

也许我想念一些东西。当我写
print(result.date);打印到我的Bloc类。但是在UI类和BlocBuilder中什么也没有。当我调试它时，我看到：返回元素行工作之后，它没有跳转到BlocBuilder，原因是每一个都继续。但是当它完成时仍然不会跳。也许我的架构或方法可能是错误的。另外，我也乐于接受有关这些的建议。

因此，总而言之，我无法在bloc生成器中一一获取“流结果的列表元素”。有人可以帮忙吗？

Answer 1

您尚未为Bloc定义状态。您应该创建一个状态

class WeatherState
class WeatherLoaded extends WeatherState{
      final Weather weather;
  WeatherLoaded(this.weather);
}

然后，您的Bloc类应如下所示：WeatherEvent和WeatherState

class WeatherBloc extends Bloc<WeatherEvent, WeatherState> {
  WeatherBloc(Weather initialState) : super(initialState);

  @override
  Stream<Weather> mapEventToState(WeatherEvent event) async*{
    switch (event) {
      case WeatherEvent.getWeather:
        // Api call call that returns a weather object.
        final res = await WeatherRequest().fetchWeathers();
        yield WeatherLoaded(res);
        break;

      case WeatherEvent.getDetails:
        break;
    }
  }
}

接下来，您的Bloc Builder应该看起来像这样

         BlocBuilder<WeatherBloc, WeatherState>(
            builder: (context, WeatherState state) {
              if(state is WeatherLoaded) {
                return (Text(state.date));
              }
              
            },
          ),

您应该重写API调用以返回Weather对象

Flutter使用BloC模式从API结果中获取列表元素

1 个答案: