Flutter TextField 입력 고고!! StatelessWidget하고 StatefulWidget 차이!!
StatelessWidget
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
String _data='';
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Text입력에제',
home: new Scaffold(
appBar: new AppBar(
title: new Text("My Input Text"),
),
body: new Container(
child: new Center(
child: new Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new TextField(
decoration: new InputDecoration(
hintText: "여기에 입력",
),
onSubmitted: (String str) {
_data = str;
},
),
new Text(_data),
],
),
),
)));
}
}
TextField에 글자를 입력하고 서브밋 버튼을 누르면 멤버변수 _data에 값을 할당
이렇게 해도 Text에는 글자가 나타나지 않음
글자를 입력해도 밑에 Text에 표시가 되지 않음
StatefulWidget
import 'package:flutter/material.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Text입력에제',
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() {
return _MyHomePageState();
}
}
class _MyHomePageState extends State<MyHomePage> {
String _data='';
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(
title: new Text("My Input Text"),
),
body: new Container(
child: new Center(
child: new Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
new TextField(
decoration: new InputDecoration(
hintText: "여기에 입력",
),
onSubmitted: (String str) {
setState(() {
_data = str;
});
},
),
new Text(_data),
],
),
),
)
);
}
}
코드가 좀 수정되었지만
TextField에 글자를 입력하고 서브밋 버튼을 누르면 멤버변수 _data에 값을 할당
이렇게 해도 Text에는 글자가 나타남
이 테스트를 하면서 보았던 오류
처음에 멤버변수 String _data; 를 초기화를 하지 않으면 아래와 같은 오류가 난다.
그래서 String _data=''; 를 해주었는데 null에 대해서는 dart 문법좀 공부해야겠다.