skip to Main Content

I’m trying to learn how to pass variables into a stateful widget.

here is my code:

class TestTest extends StatefulWidget {
  final String selectedText;
  const TestTest({Key? key, required this.selectedText,})
      : super(key: key);

  @override
  State<TestTest> createState() => _TestTestState();
}

class _TestTestState extends State<TestTest> {
  String optionAData = '';
  String optionBData = '';
  @override
  Widget build(BuildContext context) {
    switch (selectedText) {
      case 'OptionA':
        return Column(
          children: [
            WidgetDisplay1(
              onTap: (){
                setState(() {
                  optionAData = 'A123';
                });
              },
            ),
            WidgetDisplay3(
              onTap: (){
                setState(() {
                  optionAData = 'A456';
                });
              },
            ),
          ],
        );
      case 'OptionB':
        return Column(
          children: [
            WidgetDisplay5(
              onTap: (){
                setState(() {
                  optionBData = 'B123';
                });
              },
            ),
            WidgetDisplay3(onTap: (){
              setState(() {
                optionBData = 'B456';
              });
            }),
            WidgetDisplay4(
              onTap: (){
                setState(() {
                  optionBData = 'B789';
                });
              },
            ),
          ],
        );
      default:
        return Container();
    }
  }
}

this is how i’ve been told to do it but the selectedText beside the Switch key word is returning the error: Undefined name ‘selectedText’. which I thought I had defined at the top of the class with the final string selectedText.

Thanks so much and any help would be greatly appreciated.

2

Answers


  1. So, to access the data when receiving from widget, you must place the keyword "widget" before the name of the variable. With that in mind, your code will be something like this:

    class TestTest extends StatefulWidget {
    final String selectedText;
    const TestTest({Key? key, required this.selectedText,})
      : super(key: key);
    
      @override
      State<TestTest> createState() => _TestTestState();
    }
    
    class _TestTestState extends State<TestTest> {
    String optionAData = '';
    String optionBData = '';
    @override
    Widget build(BuildContext context) {
      switch (widget.selectedText) { //! Here's the main difference
        case 'OptionA':
          return Column(
            children: [
              WidgetDisplay1(
                onTap: (){
                  setState(() {
                    optionAData = 'A123';
                  });
                },
              ),
              WidgetDisplay3(
                onTap: (){
                  setState(() {
                    optionAData = 'A456';
                  });
                },
              ),
            ],
          );
        case 'OptionB':
          return Column(
            children: [
              WidgetDisplay5(
                onTap: (){
                  setState(() {
                    optionBData = 'B123';
                  });
                },
              ),
              WidgetDisplay3(onTap: (){
                setState(() {
                  optionBData = 'B456';
                });
              }),
              WidgetDisplay4(
                onTap: (){
                  setState(() {
                    optionBData = 'B789';
                  });
                },
              ),
            ],
          );
        default:
          return Container();
      }
    }
    

    Hope it helped!

    Login or Signup to reply.
  2. You can access all the variables anywhere by just using the keyword ‘widget’.
    Example:

    widget.selectedText 
    
    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search