前提・実現したいこと
Flutter初心者です。
providerを使用し、ListTileのontapイベントでviewModelのメソッドを呼び出し、値を変更し、UIに反映させたいです。
発生している問題・エラーメッセージ
onTap: () { Provider.of<TestViewModel>(context, listen: flase).incrementCounter(); }, ```上記のようにlisten: flaseとしていたため、viewModel側でのnotifyListeners();によってUIが更新されないかと思い、listen: trueとした場合、下記のようなエラーが発生しました。
════════ Exception caught by gesture ═══════════════════════════════════════════════════════════════
The following assertion was thrown while handling a gesture:
Tried to listen to a value exposed with provider, from outside of the widget tree.
This is likely caused by an event handler (like a button's onPressed) that called
Provider.of without passing listen: false
.
To fix, write:
Provider.of<TestViewModel>(context, listen: false);
It is unsupported because may pointlessly rebuild the widget associated to the
event handler, when the widget tree doesn't care about the value.
listen:
1 2### 該当のソースコード 3
import 'package:flutter/material.dart';
import 'TestWidget.dart';
void main() => runApp(App());
class App extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'provider sample',
home: TestWidget(),
);
}
}
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:provider/provider.dart';
import 'TestViewModel.dart';
class TestWidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MultiProvider(
providers: [
ChangeNotifierProvider(create: (_) => TestViewModel()),
],
child: Scaffold(
appBar: AppBar(
title: Text('テスト')
),
body: SafeArea(
child: TestList(),
),
)
);
}
}
class TestList extends StatelessWidget {
@override
Widget build(BuildContext context) {
return ListView.builder(
itemCount: 10,
itemBuilder: (BuildContext context, int index) {
return _messageItem(
context,
);
},
);
}
Widget _messageItem(BuildContext context) {
return Container(
child: ListTile(
title: Text(
//ここに表示する数値が変更されることが期待する動作
Provider.of<TestViewModel>(context, listen: false).counter.toString(),
style: TextStyle(color: Colors.black, fontSize: 18.0),
),
onTap: () {
//listen: trueにするとエラー、falseにすると実行されるがUI更新がされない
Provider.of<TestViewModel>(context, listen: true).incrementCounter();
},
),
);
}
}
import 'package:flutter/material.dart';
class TestViewModel extends ChangeNotifier {
int _counter = 0;
int get counter => _counter;
void incrementCounter() {
this._counter++;
notifyListeners();
}
}
あなたの回答
tips
プレビュー