flutter key

//子元素状态不更新 需要添加key,理解为vue的key
Flutter key子类包含 LocalKey 和 GlobalKey 。
//局部键(LocalKey):ValueKey、ObjectKey、UniqueKey
	const Box({Key? key, required this.color}):super(key:key);
//传递key
	Box(color: Colors.green,key:ValueKey(3)),
	Box(color: Colors.green,key:UniqueKey()),  //UniqueKey() 唯一值 每次都会随机生成
	Box(color: Colors.green,key:ObjectKey(Box(color:Colors.green))),  //ObjectKey(Box(color:Colors.green)) 对象key,必须传递一个对象
// 全局键(GlobalKey): GlobalKey、GlobalObjectKey
	GlobalKey _globalKey=GlobalKey()    
	GlobalObjectKey _globalKey=GlobalObjectKey(Box(color:Colors.green)))
//获取子组件的状态和属性
    var gstate=	_globalKey.currentSate  as _BoxState //获取子组件的状态 调用子组件的属性       as _BoxState强制转换为子组件类型
		print(gstate.属性/方法)     gstate._count++;//获取子组件的状态并进行操作
		
	var gWidget= _globalKey.currentWidget as  Box //可以子widget     as Box强制转换为子组件类型
		print(gWidget.属性/方法)
		
	var renderBox= (_globalKey.currentContext!.findRenderObject() as RenderBox); //可以获取渲染的属性     as RenderBox强制转换为子组件类型
		print(gWidget.属性/方法)
import 'package:flutter/material.dart';

void main() {
  runApp(
    const MaterialApp(title: 'contaniner', home: MyAPP()),
  );
}

class MyAPP extends StatefulWidget {
  const MyAPP({super.key});
  @override
  State<MyAPP> createState() => _MyAPPState();
}

class _MyAPPState extends State<MyAPP> {
  final GlobalKey _globalKey = GlobalKey();
  List<Widget> list = [];
  @override
  void initState() {
    super.initState();
    list = [
      Box(color: Colors.red, key: _globalKey),
      Box(color: Colors.yellow, key: ValueKey(2)),
      Box(color: Colors.green, key: ValueKey(3)),
    ];
  }

  Widget build(BuildContext context) {
    return Scaffold(
      floatingActionButton: FloatingActionButton(
        onPressed: () {
          var gstate = _globalKey.currentState as _BoxState;
          print(gstate);
          gstate.run();
          setState(() {
            gstate._count++; // 将 body修改为  Box(color: Colors.red, key: _globalKey)  生效
            print(gstate._count);
          });
        }, //执行方法
        tooltip: 'Increment', // 提示
        child: const Icon(Icons.refresh), //按钮文案
      ),
      appBar: AppBar(
        title: const Center(child: Text('PageViewSwiper1')),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: list,
        ),
      ),
    );
  }
}

class Box extends StatefulWidget {
  final Color color;
  Box({super.key, required this.color});
  @override
  State<Box> createState() => _BoxState();
}

class _BoxState extends State<Box> {
  int _count = 0;
  run() {
    _count++;
  }

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      width: 100,
      height: 100,
      child: ElevatedButton(
        style: ButtonStyle(
          shape: MaterialStateProperty.all(
            RoundedRectangleBorder(borderRadius: BorderRadius.circular(8)),
          ),
          backgroundColor: MaterialStateProperty.all(widget.color),
        ),
        onPressed: () => setState(() => _count++),
        child: Text(
          "$_count",
          style: Theme.of(context).textTheme.headlineLarge,
        ),
      ),
    );
  }
}

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值