Flutter,如何使用 getx 刷新我的控制器和请求
Flutter, how to refresh my controller and request with getx
我正在使用 getx 创建一个应用程序。我有简单的 GET 请求,我将数据显示到屏幕上。在详细信息屏幕中,我放置了一个按钮来刷新请求,请求的响应是随机出现的,因此每次用户按下按钮时都会显示不同的文本。我不知道该怎么做。
我的控制器:
class JokeController extends GetxController {
var isLoading = true.obs;
var joke = Joke().obs;
@override
void onInit() {
fetchJoke();
super.onInit();
}
void fetchJoke() async {
isLoading(true);
try {
var chosenCategory = GetStorage().read("chosenCategory");
var _joke = await Requests.getJoke(chosenCategory);
if (_joke != null) {
joke.value = _joke;
}
} finally {
isLoading(false);
}
}
}
我的要求:
static Future<Joke> getJoke(String chosenCategory) async {
try {
var response =
await client.get(Uri.parse(url)).timeout(Duration(seconds: 10));
if (response.statusCode == 200) {
Joke _joke = new Joke();
var responseBody = response.body;
return _joke.jokeFromJson(responseBody);
}
} catch (error) {
return null;
}
}
页内(Obx):
Obx(() {
if (jokeController.isLoading.value) {
return Center(
child: CircularProgressIndicator().reactive(),
);
}
return Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Center(
child: Padding(
padding: EdgeInsets.only(
right: MediaQuery.of(context).size.width * .1,
left: MediaQuery.of(context).size.width * .1),
child: Text(
jokeController.joke.value.value,
textAlign: TextAlign.center,
style: TextStyle(
fontSize: MediaQuery.of(context).size.width * .06,
fontWeight: FontWeight.bold),
),
)),
SizedBox(
height: MediaQuery.of(context).size.height * .2,
),
Container(
alignment: Alignment.bottomCenter,
width: 250,
height: 60,
child: Opacity(
opacity: 0.88,
child: ElevatedButton(
style: ElevatedButton.styleFrom(
padding: EdgeInsets.zero,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(30)),
shadowColor: Colors.orange),
clipBehavior: Clip.antiAlias,
onPressed: () {
//Refresh the joke
},
child: Ink(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.bottomCenter,
end: Alignment.topCenter,
colors: [
Colors.orange,
Colors.orange[200]
])),
child: Container(
constraints:
BoxConstraints(maxHeight: 300, minWidth: 50),
alignment: Alignment.center,
child: Text(
"SEE ANOTHER JOKE FROM THIS CATEGORY",
style: TextStyle(
fontSize:
MediaQuery.of(context).size.width * .03,
fontWeight: FontWeight.bold),
),
),
),
)))
],
);
})
到目前为止,我在 onPressed 下尝试过的内容:
jokeController.joke.refresh();
和
设置状态
和
Get.to(JokePage());
但这些都不起作用。
此外,我从 GetStorage 获取类别,当用户单击上一页中的类别时,我会接受它。该类别不会改变。提前致谢。
和页面中的图片:
您需要在按钮按下事件上再次调用 fetchJoke()
方法。
你可以这样做:
onPressed: () {
jokeController.fetchJoke();//Refresh the joke
},
Get.offAndToNamed('/yourRoute');
and/or
Get.offAndToNamed('/yourRoute', arguments: someArgs);
我正在使用 getx 创建一个应用程序。我有简单的 GET 请求,我将数据显示到屏幕上。在详细信息屏幕中,我放置了一个按钮来刷新请求,请求的响应是随机出现的,因此每次用户按下按钮时都会显示不同的文本。我不知道该怎么做。
我的控制器:
class JokeController extends GetxController {
var isLoading = true.obs;
var joke = Joke().obs;
@override
void onInit() {
fetchJoke();
super.onInit();
}
void fetchJoke() async {
isLoading(true);
try {
var chosenCategory = GetStorage().read("chosenCategory");
var _joke = await Requests.getJoke(chosenCategory);
if (_joke != null) {
joke.value = _joke;
}
} finally {
isLoading(false);
}
}
}
我的要求:
static Future<Joke> getJoke(String chosenCategory) async {
try {
var response =
await client.get(Uri.parse(url)).timeout(Duration(seconds: 10));
if (response.statusCode == 200) {
Joke _joke = new Joke();
var responseBody = response.body;
return _joke.jokeFromJson(responseBody);
}
} catch (error) {
return null;
}
}
页内(Obx):
Obx(() {
if (jokeController.isLoading.value) {
return Center(
child: CircularProgressIndicator().reactive(),
);
}
return Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Center(
child: Padding(
padding: EdgeInsets.only(
right: MediaQuery.of(context).size.width * .1,
left: MediaQuery.of(context).size.width * .1),
child: Text(
jokeController.joke.value.value,
textAlign: TextAlign.center,
style: TextStyle(
fontSize: MediaQuery.of(context).size.width * .06,
fontWeight: FontWeight.bold),
),
)),
SizedBox(
height: MediaQuery.of(context).size.height * .2,
),
Container(
alignment: Alignment.bottomCenter,
width: 250,
height: 60,
child: Opacity(
opacity: 0.88,
child: ElevatedButton(
style: ElevatedButton.styleFrom(
padding: EdgeInsets.zero,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(30)),
shadowColor: Colors.orange),
clipBehavior: Clip.antiAlias,
onPressed: () {
//Refresh the joke
},
child: Ink(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.bottomCenter,
end: Alignment.topCenter,
colors: [
Colors.orange,
Colors.orange[200]
])),
child: Container(
constraints:
BoxConstraints(maxHeight: 300, minWidth: 50),
alignment: Alignment.center,
child: Text(
"SEE ANOTHER JOKE FROM THIS CATEGORY",
style: TextStyle(
fontSize:
MediaQuery.of(context).size.width * .03,
fontWeight: FontWeight.bold),
),
),
),
)))
],
);
})
到目前为止,我在 onPressed 下尝试过的内容: jokeController.joke.refresh(); 和 设置状态 和 Get.to(JokePage());
但这些都不起作用。
此外,我从 GetStorage 获取类别,当用户单击上一页中的类别时,我会接受它。该类别不会改变。提前致谢。
和页面中的图片:
您需要在按钮按下事件上再次调用 fetchJoke()
方法。
你可以这样做:
onPressed: () {
jokeController.fetchJoke();//Refresh the joke
},
Get.offAndToNamed('/yourRoute');
and/or
Get.offAndToNamed('/yourRoute', arguments: someArgs);