简体   繁体   English

Flutter Bloc 如何从 Widget 本身更新 BlocBuilder 中的 Widget?

[英]Flutter Bloc How to update Widget in BlocBuilder from the Widget itself?

How can to update a Bloc widget from the bloc Widget itself with the Slider?如何使用 Slider 从 bloc 小部件本身更新 Bloc 小部件?

The Event for the Chart Data is executed from another Widget.图表数据的事件是从另一个小部件执行的。 When the data is fetched this Widget is opened.获取数据后,此 Widget 将打开。 When I change the Slider I want the chart to be updated withe the date but keep the other data.当我更改 Slider 时,我希望图表随日期更新,但保留其他数据。 Would be too much to fetch all the Data again.再次获取所有数据会太多。

How can I get access only the data changed from the same widget?如何仅访问从同一小部件更改的数据?

I have the following Bloc Builder Widget, bloc_event, bloc and bloc_state我有以下 Bloc Builder Widget、bloc_event、bloc 和 bloc_state

The Widget:小部件:

class ChartWidget extends StatelessWidget {
ChartWidget({Key key}) : super(key: key);

@override
Widget build(BuildContext context) {

double valueSliderDate;
return BlocBuilder<ChartDataBloc, ChartDataState>(
  builder: (context, state) {
    if (state is ChartDataLoadInProgress) {
      return LoadingIndicator();
    } else if (state is ChartDataLoadSuccess) {
      final chartData = state.chartData;
      final maxValueAll = getMaxValueAll(chartData);
      final List<double> dates = getValuesDate(chartData);
      valueSliderDate = dates.first;

      return Column(children: <Widget>[
        
        Expanded(
          child: MyFancyChart(chartData, valueSliderDate),
        ),
        Slider(
          min: dates.first,
          max: dates.last,
           divisions: dates.length,
           value: valueSliderDate,
          onChanged: (value) {
            context.read<ChartDataBloc>().add(DateSliderSet(value));
          },
        ),
      ]);
    } else {
      return Container();
    }
  },
);
}

This is the bloc_event with two events:这是带有两个事件的 bloc_event:

abstract class ChartDataEvent {
const ChartDataEvent();
@override
List<Object> get props => [];  }

class SpecificIndicatorIdSet extends ChartDataEvent {
const SpecificIndicatorIdSet(this.indicator);
final Indicator indicator;

@override
List<Object> get props => [indicator];  }

class DateSliderSet extends ChartDataEvent {
const DateSliderSet(this.dateSlider);
final double dateSlider;

@override
List<Object> get props => [dateSlider];  }

This is the bloc itself:这是集团本身:

class ChartDataBloc extends Bloc<ChartDataEvent, ChartDataState> {
final ChartDataRepository chartDataRepository;
ChartDataBloc({@required this.chartDataRepository}) : super(ChartDataLoadInProgress());

@override
Stream<ChartDataState> mapEventToState(ChartDataEvent event) async* {
if (event is SpecificIndicatorIdSet) {
yield* _mapIndicatorsLoadedToState(event);
} else if (event is DateSliderSet) {
yield* _mapDateSliderToState(event);  }    }

Stream<ChartDataState> _mapDateSliderToState(
  DateSliderSet event
  ) async* {
try {
  final dateSlider = event.dateSlider;
  yield DateSliderLoadSuccess(
    dateSlider,
  );
} catch (_) {
  yield DateSliderLoadFailure();  }   }

Stream<ChartDataState> _mapIndicatorsLoadedToState(
  SpecificIndicatorIdSet event
  ) async* {
try {
  final chartData = await this.chartDataRepository.loadChartData(event.indicator.id);
  yield ChartDataLoadSuccess(
    sortToListOfLists(chartData),
    event.indicator.name
  );
} catch (_) {
  yield ChartDataLoadFailure();  }  }  }

This is the bloc_state:这是 bloc_state:

abstract class ChartDataState {
const ChartDataState();
@override
List<Object> get props => [];  }

class ChartDataLoadInProgress extends ChartDataState {}

class ChartDataLoadSuccess extends ChartDataState {
final List<List<ChartData>> chartData;
final String titleIndicator;
const ChartDataLoadSuccess(this.chartData,this.titleIndicator);

@override
List<Object> get props => [chartData, titleIndicator];

@override
String toString() => 'ChartDataLoadSuccess { topics: ' + chartData + ' }';  }

class ChartDataLoadFailure extends ChartDataState {}

class DateSliderLoadSuccess extends ChartDataState {
final double dateSlider;
const DateSliderLoadSuccess(this.dateSlider);

@override
List<Object> get props => [dateSlider];

@override
String toString() => 'DateSliderLoadSuccess { dateSlider: ' + dateSlider.toString() + ' }';  
}

class DateSliderLoadFailure extends ChartDataState {}

Thanks in advance提前致谢

Have you tried creating a variable inside your bloc to store the original data?您是否尝试过在您的块中创建一个变量来存储原始数据?

You would be able to store the data and be able to continue using your bloc and updating your widget.您将能够存储数据并能够继续使用您的区块并更新您的小部件。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM