我是Flutter的新手,我正在绑定SetState操作,我正在尝试以逐块的方式组织代码,但SetState不起作用



这是我正在使用的代码,我在lib文件夹中创建了一个新的文件夹名HomePage,并将我的Home.dart文件放在那里,在我到达setState之前,一切都很好。setState根本不起作用。

Main.飞镖代码

import 'package:flutter/material.dart';
import 'package:test_project1/HomePage/Home.dart';
main() => runApp(new DarkX());
class DarkX extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return new DarkXState();
}
}
class DarkXState extends State<DarkX>{
@override
Widget build(BuildContext context) {
var home = new DarkXAppHomePage().createHomePage();
return home;
}
} 

主页.飞镖代码`

import 'package:flutter/material.dart';
class DarkXAppHomePage {
var _isLoading = true;
createHomePage(){
var homePageScaffold = createHomePageScaffold();
return MaterialApp(home: homePageScaffold, debugShowCheckedModeBanner: false);
}

//Scaffold For Home Page
createHomePageScaffold(){
var homeAppbar = homeAppBar();
var homebody = homeBody();
var scaffold = new Scaffold(appBar: homeAppbar, body: homebody,);
return scaffold;
}
//AppBar For Home Page
homeAppBar(){
var text = createText('Welcome');
var refreshbutton = refreshButton(refreshHomePage);
var appBar = new AppBar(title: text,actions: <Widget>[refreshbutton],);
return appBar;
}
//Body For Home Page
homeBody(){
var loadingState = _isLoading ? CircularProgressIndicator() : createText('Finished Loading');
return new Center(child: loadingState);
}
refreshButton(Function onPress){
var refreshicon = refreshIcon();
var refreshbutton = new IconButton(icon: refreshicon, onPressed: (){
onPress();
},);
return refreshbutton;
}
//homepage Refresh Action
refreshHomePage(){
setState(){
_isLoading = false;
}
}
//Create Text
createText( String text ){
var newText = new Text(text);
return newText;
}
//Refresh Icon
refreshIcon(){
var refreshicon = new Icon(Icons.refresh);
return refreshicon;
}
}

现在,当我在refreshHomePage函数中使用setState时,它不起作用,并发出警告"声明"setState"未被引用。尝试删除"setState"的声明。dart(unused_lement("正在显示。请提出任何建议。感谢您的帮助。

您应该记住的第一件事是setState()方法是State<E extends StatefulWidget>类的方法。根据您的源代码,您正在调用DarkXAppHomePage类的setState()方法。DarkXAppHomePage类不是State类和State的子类。因此,您的代码不起作用。您的setState()方法也执行了错误的实现。你的解决方案,我建议你两个步骤。

第一步,你应该再次仔细阅读这些文档。

第二步,我会帮助你一步一步修改你的来源。

步骤1:您的原始来源。

class DarkXAppHomePage {
var _isLoading = true;
createHomePage(){
var homePageScaffold = createHomePageScaffold();
return MaterialApp(home: homePageScaffold, debugShowCheckedModeBanner: false);
}

//Scaffold For Home Page
createHomePageScaffold(){
var homeAppbar = homeAppBar();
var homebody = homeBody();
var scaffold = new Scaffold(appBar: homeAppbar, body: homebody,);
return scaffold;
}
//AppBar For Home Page
homeAppBar(){
var text = createText('Welcome');
var refreshbutton = refreshButton(refreshHomePage);
var appBar = new AppBar(title: text,actions: <Widget>[refreshbutton],);
return appBar;
}
//Body For Home Page
homeBody(){
var loadingState = _isLoading ? CircularProgressIndicator() : createText('Finished Loading');
return new Center(child: loadingState);
}
refreshButton(Function onPress){
var refreshicon = refreshIcon();
var refreshbutton = new IconButton(icon: refreshicon, onPressed: (){
onPress();
},);
return refreshbutton;
}
//homepage Refresh Action
refreshHomePage(){
setState(){
_isLoading = false;
} // ★ => Look at this, wrong implement. You have to put a method as `setState()` parameter instead of write a new `setState()` method liked that.
}
//Create Text
createText( String text ){
var newText = new Text(text);
return newText;
}
//Refresh Icon
refreshIcon(){
var refreshicon = new Icon(Icons.refresh);
return refreshicon;
}

}

步骤2:将其缩短以便于阅读。(也许不容易理解。但是我们很快就会更新。(。

class DarkXAppHomePage {  
var _isLoading = true;
createHomePage() => MaterialApp(home: createHomePageScaffold(), debugShowCheckedModeBanner: false);
//Scaffold For Home Page
createHomePageScaffold() => Scaffold(appBar: homeAppBar(), body: homeBody());
//AppBar For Home Page
homeAppBar() => AppBar(title: createText('Welcome'), actions: <Widget>[refreshButton(refreshHomePage)]);
//Body For Home Page
homeBody() => Center(child: _isLoading ? CircularProgressIndicator() : createText('Finished Loading'));
refreshButton(Function onPress) => IconButton(icon: refreshIcon(), onPressed: () => onPress());
//homepage Refresh Action
refreshHomePage() => setState(() => _isLoading = false); // ★ => `() => _isLoading = false` is the short way represent an anonymous method. You put this anonymous method as a parameter of `setState()`
//Create Text
createText(String text) => Text(text);
//Refresh Icon
refreshIcon() => Icon(Icons.refresh);

}

第3步:现在,休息一下。您必须创建一个包含_isLoading属性的StatefulWidget

class DarkXAppHomePage extends StatefulWidget {
var _isLoading = true;
@override
_DarkXAppHomePageState createState() => _DarkXAppHomePageState();
}
class _DarkXAppHomePageState extends State<DarkXAppHomePage> {
//homepage Refresh Action
refreshHomePage() => setState(() => widget._isLoading = false); // ★ => Just look at this. It have a obscure technique here. If you have right impelement which detail here (https://api.flutter.dev/flutter/widgets/StatefulWidget-class.html), Flutter framework auto put the instance of your `DarkXAppHomePage` inside `_DarkXAppHomePageState` with the named `widget`. As you see, the `_DarkXAppHomePageState` force state of `State<DarkXAppHomePage>` and `DarkXAppHomePage` have `createState()` method which provided `_DarkXAppHomePageState`.
@override
Widget build(BuildContext context) {
return MaterialApp(
//Scaffold For Home Page
home: Scaffold(
//AppBar For Home Page
appBar: AppBar(
//Create Text
title: Text('Welcome'),
actions: <Widget>[
IconButton(
//Refresh Icon
icon: Icon(Icons.refresh),
onPressed: () => refreshHomePage,
),
],
),
body: Center(
child: widget._isLoading ? CircularProgressIndicator() : Text('Finished Loading'),
),
),
debugShowCheckedModeBanner: false,
);
}
}

步骤4:将DarkXAppHomePage连接到main。

main() => runApp(DarkX());
class DarkX extends StatelessWidget {
@override
Widget build(BuildContext context) => DarkXAppHomePage();
}

我在没有IDE的情况下写了这个代码,所以如果我有任何拼写错误,请随时帮助我修复。

当将函数传递给另一个小部件时,可以使用回调函数

Widget refreshButton(VoidCallBack onPress){
Widget refreshicon = refreshIcon();
Widget refreshbutton = new IconButton(icon: refreshicon, onPressed: onPress,);
return refreshbutton;
}

你的代码看起来被过度设计了,也许简化的东西让它更容易理解。并且总是宣称打字是一种好习惯。

它会这样工作,也许是我,但很难按照你现有的方式遵循你的代码。

setState必须在statefullWidget内部,或者作为参数从那里发送。

import 'package:flutter/material.dart';
main() => runApp(new DarkX());
class DarkX extends StatefulWidget {
@override
_DarkXState createState() => _DarkXState();
}
class _DarkXState extends State<DarkX> {
var _isLoading = true;
@override
Widget build(BuildContext context) {
return MaterialApp(
home: createHomePageScaffold(), debugShowCheckedModeBanner: false);
}
//Scaffold For Home Page
createHomePageScaffold() {
var homeAppbar = homeAppBar();
var homebody = homeBody();
var scaffold = new Scaffold(
appBar: homeAppbar,
body: homebody,
);
return scaffold;
}
//AppBar For Home Page
homeAppBar() {
var text = createText('Welcome');
var refreshbutton = refreshButton(refreshHomePage);
var appBar = new AppBar(
title: text,
actions: <Widget>[refreshbutton],
);
return appBar;
}
//Body For Home Page
homeBody() {
var loadingState = _isLoading
? CircularProgressIndicator()
: createText('Finished Loading');
return new Center(child: loadingState);
}
refreshButton(Function onPress) {
var refreshicon = refreshIcon();
var refreshbutton = new IconButton(
icon: refreshicon,
onPressed: () {
onPress();
},
);
return refreshbutton;
}
//homepage Refresh Action
refreshHomePage() {
setState(() {
_isLoading = false;
});
}
//Create Text
createText(String text) {
var newText = new Text(text);
return newText;
}
//Refresh Icon
refreshIcon() {
var refreshicon = new Icon(Icons.refresh);
return refreshicon;
}
}

最新更新