flutter 为什么我的单选按钮状态为“未更新”?

r1zhe5dt  于 2023-03-04  发布在  Flutter
关注(0)|答案(3)|浏览(136)

我试过了

  • 使用两个Obx,每个RadioListTile一个
  • 使用TextEditingController()作为变量,并从gender. text中获取值

但单选按钮仍选择初始值/
最小代码复制:

import 'package:flutter/material.dart';
import 'package:get/get.dart';

void main() => runApp(GetMaterialApp(home: Home()));

class Controller extends GetxController {
  var gender = "F".obs;

  void onChangedGender(String? value) {
    gender = (value ?? "M").obs;
    print(gender.value);
  }
}

class Home extends StatelessWidget {
  @override
  Widget build(context) {
    final Controller c = Get.put(Controller());

    return Scaffold(
      body: Center(
        child: SizedBox(
          width: 400,
          child: Obx(
            () => Row(
              children: [
                Expanded(
                  child: RadioListTile(
                    value: "M",
                    groupValue: c.gender.value,
                    title: const Text("Male"),
                    onChanged: c.onChangedGender,
                  ),
                ),
                Expanded(
                  child: RadioListTile(
                    value: "F",
                    groupValue: c.gender.value,
                    title: const Text("Female"),
                    onChanged: c.onChangedGender,
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

在线尝试:https://zapp.run/edit/flutter-zla606cyla70?entry=lib/main.dart&file=lib/main.dart

uurity8g

uurity8g1#

void onChangedGender(String? value) {
    gender.value = (value ?? "M");
  }

用上面的函数替换你的函数

6za6bjd0

6za6bjd02#

import 'package:flutter/material.dart';
import 'package:get/get.dart';

void main() => runApp(GetMaterialApp(home: Home()));

class Controller extends GetxController {
  RxInt gender = 1.obs;

  void onChangedGender(Object? v) {
    gender.value = int.parse(v.toString());
  }
}

class Home extends StatelessWidget {
  @override
  Widget build(context) {
    final Controller c = Get.put(Controller());

    return Scaffold(
      body: Center(
        child: SizedBox(
          width: 400,
          child: Obx(
            () => Row(
              children: [
                Expanded(
                  child: RadioListTile(
                    value: 1,
                    groupValue: c.gender.value,
                    title: const Text("Male"),
                    onChanged: (v){
                      c.onChangedGender(v);
                    },
                  ),
                ),
                Expanded(
                  child: RadioListTile(
                    value: 2,
                    groupValue: c.gender.value,
                    title: const Text("Female"),
                    onChanged: (v){
                      c.onChangedGender(v);
                    },
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}
xwmevbvl

xwmevbvl3#

1.当你想改变小部件的状态时,你应该使用有状态的小部件,而不是无状态的小部件。
1.要在有状态小部件中更改小部件的状态,应该使用函数setState。
您修改的工作代码:

import 'package:flutter/material.dart';
import 'package:get/get.dart';

void main() => runApp(GetMaterialApp(home: Home()));

class Controller extends GetxController {
  var gender = "F".obs;

  void onChangedGender(String? value) {
    gender = (value ?? "M").obs;
    print(gender.value);
  }
}

class MyWidget extends StatefulWidget {
  const MyWidget({super.key});

  @override
  State<MyWidget> createState() => _MyWidgetState();
}

class _MyWidgetState extends State<MyWidget> {
  @override
  Widget build(context) {
    final Controller c = Get.put(Controller());
    return Scaffold(
      body: Center(
        child: SizedBox(
          width: 400,
          child: Obx(
            () => Row(
              children: [
                Expanded(
                  child: RadioListTile(
                    value: "M",
                    groupValue: c.gender.value,
                    title: const Text("Male"),
                    onChanged: (val) {
                      setState(() { c.onChangedGender(val); }); 
                      },
                  ),
                ),
                Expanded(
                  child: RadioListTile(
                    value: "F",
                    groupValue: c.gender.value,
                    title: const Text("Female"),
                    onChanged: (val) {
                      setState(() { c.onChangedGender(val); }); 
                      },
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

class Home extends StatelessWidget  {
    @override
  Widget build(context) {
    return MyWidget();
    }
}

相关问题