如何仅在一个 textformfield flutter 中更改值？

Question

我在函数 Counter 中连续使用。但是当我点击递增或递减时，我同时更改了两个字段中的数据。我知道在 CounterCubit 中我只声明了一个值，它两次传递给同一个函数，因此它发生了变化。告诉我如何正确分离每个字段的值使得值不会同时在两个字段中发生变化，而只会在一个对应的字段中发生变化？

过滤对话框

Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: Dialog(
        insetPadding: const EdgeInsets.only(top: 100, left: 24, right: 24),
        backgroundColor: Colors.transparent,
        shape: const RoundedRectangleBorder(
            borderRadius: BorderRadius.all(Radius.circular(24))),
        child: Container(
          width: MediaQuery.of(context).size.width,
          decoration: const BoxDecoration(
            color: constants.Colors.greyDark,
            borderRadius: BorderRadius.all(Radius.circular(24)),
          ),
          child: Padding(
            padding: const EdgeInsets.fromLTRB(21, 38, 21, 24),
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                 const PriceCounter(title: 'From'),
              ]

价格计数器

Widget build(BuildContext context) {
    final CounterCubit cubit = BlocProvider.of<CounterCubit>(context);

    return Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: [
        Column(
          children: [
            BlocBuilder<CounterCubit, CounterState>(
              builder: (context, state) => InputField(
                  price: state.countValue.toString(),
                  textStyle: constants.Styles.normalBookTextStyleWhite),
            ),
            Row(
              children: [
                IconButton(
                  onPressed: () => cubit.increment(),
                  icon: SvgPicture.asset(constants.Assets.plus),
                  constraints: const BoxConstraints(),
                  padding: EdgeInsets.zero,
                ),
                const SizedBox(width: 24),
                Text(title, style: constants.Styles.smallLtStdTextStyleWhite),
                const SizedBox(width: 24),
                IconButton(
                  onPressed: () => cubit.decrement(),
                  icon: SvgPicture.asset(constants.Assets.minus),
                  constraints: const BoxConstraints(),
                  padding: EdgeInsets.zero,
                ),
              ],
            ),
          ],
        ),
        // const SizedBox(width: 24),
        Column(
          children: [
            BlocBuilder<CounterCubit, CounterState>(
              builder: (context, state) => InputField(
                  price: state.countValue.toString(),
                  textStyle: constants.Styles.normalBookTextStyleWhite),
            ),
            Row(
              children: [
                IconButton(
                  onPressed: () => cubit.increment(),
                  icon: SvgPicture.asset(constants.Assets.plus),
                  constraints: const BoxConstraints(),
                  padding: EdgeInsets.zero,
                ),
                const SizedBox(width: 24),
                Text(title, style: constants.Styles.smallLtStdTextStyleWhite),
                const SizedBox(width: 24),
                IconButton(
                  onPressed: () => cubit.decrement(),
                  icon: SvgPicture.asset(constants.Assets.minus),
                  constraints: const BoxConstraints(),
                  padding: EdgeInsets.zero,
                ),

输入字段

class InputField extends StatefulWidget {
  final String price;
  final TextStyle textStyle;

  const InputField({Key? key, required this.price, required this.textStyle})
      : super(key: key);

  @override
  State<InputField> createState() => _InputField();
}

class _InputField extends State<InputField> {
  final _formKey = GlobalKey<FormState>();
  final _priceController = TextEditingController();

  @override
  void dispose() {
    _priceController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) => SizedBox(
        width: 90,
        child: Form(
          key: _formKey,
          child: TextFormField(
            keyboardType: TextInputType.number,
            controller: _priceController..text = '€${widget.price} KWh',
            style: widget.textStyle,
            textAlign: TextAlign.center,
            decoration: const InputDecoration(
              contentPadding: EdgeInsets.zero,
              border: InputBorder.none,
            ),
          ),
        ),
      );
}

计数器状态

class CounterState {
  final double countValue;
  const CounterState({required this.countValue});
}

反肘

class CounterCubit extends Cubit<CounterState> {
  CounterCubit() : super(const CounterState(countValue: 0.13));

  void increment() => emit(CounterState(countValue: state.countValue + 0.01));

  void decrement() => emit(CounterState(countValue: state.countValue - 0.01));
}

这是结果

Answer 1

您将完全相同的状态传递给两个输入：

state.countValue

为什么不直接为另一个输入字段创建另一个状态？

state.firstCountValue
state.secondCountValue

如何仅在一个 textformfield flutter 中更改值？

How to change value in only one textformfield flutter?

flutter

dart

counter