Dolphin
Dolphin

Reputation: 38763

The hookwidget does not rerender after updating the state object in Flutter

When I am using this code to update the object of state in Flutter:

counter.value.depth++;

And the page does not rerender. This is my full minimal example code:

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_hooks/flutter_hooks.dart';
import 'package:seed/src/test/Channel.dart';

class Home extends HookWidget {
  @override
  Widget build(BuildContext context) {

    var counter = useState<Channel>(new Channel());

    void onclick(){
      if(counter.value == null){
        Channel channel = new Channel();
        counter.value = channel;
        channel.depth++;
      }else{
        counter.value.depth++;
      }
    }

    return(
      Scaffold(
          body:SafeArea(
              child:Column(
                  children: [
                    Text(counter.value==null?"0":counter.value.depth.toString()),
                    RaisedButton(
                      child: Text("click"),
                      onPressed: () => onclick(),
                    )
                  ],
              )
          ),
      )
    );
  }
}

What should I do to make it rerender to update the page button? This is the pubspec.yaml dependency:

dependencies:
  flutter:
    sdk: flutter
  flutter_hooks: ^0.12.0

When the useState stores int, it works fine. When it is taking place with an object, it do not work. Am I missing something?

This is the channel:

import 'dart:convert';

class Channel {
  Channel({
    this.depth = 0,
  });

  int depth;
}

Upvotes: 1

Views: 1436

Answers (1)

Randal Schwartz
Randal Schwartz

Reputation: 44091

You should put your provider (counter) as a global outside your Home class. You're recreating the variable on every build pass, and it's unwired from the onclick after the first hit.

At least I think so. Still learning riverpod.

Upvotes: 1

Related Questions