Flutter 状态变量传递给 widget

Question

我写了一个简单的dart程序来测试

int

的通过

a(int x) {
  x++;
  print(x);
}

main() {
  int x = 1;
  a(x);
  print(x);
}

输出：

2 1

这意味着有2个独立的

int

，通过后它们不会互相影响。

---

但是在下面的flutter程序中，似乎state的int变量在通过构造函数传递后影响了widget的int变量。

import 'package:flutter/material.dart';

class CounterDisplay extends StatelessWidget {
  const CounterDisplay({required this.count, super.key});

  final int count;

  @override
  Widget build(BuildContext context) {
    return Text('Count: $count');
  }
}

class CounterIncrementor extends StatelessWidget {
  const CounterIncrementor({required this.onPressed, super.key});

  final VoidCallback onPressed;

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      onPressed: onPressed,
      child: const Text('Increment'),
    );
  }
}

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

  @override
  State<Counter> createState() => _CounterState();
}

class _CounterState extends State<Counter> {
  int _counter = 0;

  void _increment() {
    setState(() {
      ++_counter;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: <Widget>[
        CounterIncrementor(onPressed: _increment),
        const SizedBox(width: 16),
        CounterDisplay(count: _counter),
      ],
    );
  }
}

void main() {
  runApp(
    const MaterialApp(
      home: Scaffold(
        body: Center(
          child: Counter(),
        ),
      ),
    ),
  );
}

以上代码来自 https://docs.flutter.dev/ui#chang-widgets-in-response-to-input，第二部分。

因为

CounterDisplay(count: _counter)

将 int 传递给构造函数。我想pass后应该有2个独立的int，为什么

_counter

从

_CounterState

的改变会影响

count

从

CounterDisplay

的变化？

Answer 1

当父 widget 由于 setState 而重建时，子 widget 也会重建，因为它的参数发生了变化。 这是预期的，并且很有用。