skip to Main Content

I have select Widget which is reusable widget I use to build a page with filters, so for each that select widget i need unique state, that i can get it value later from. I tried to use StateProviderFamily from Riverprod but got error:

Unhandled Exception: type ‘AutoDisposeProviderFamily<String, String>’ is not a subtype of type ‘StateProviderFamily<String, String>’ of ‘function result’

final selectValueProvider = StateProviderFamily<String,String>((ref, arg) =>'' );

class Select extends HookConsumerWidget {
    const Select({Key? key, required this.name}) : super(key: key);

    final String name;
    
     @override
    Widget build(BuildContext context, WidgetRef ref) {
    return Padding(
      padding: const EdgeInsets.only(top: 10.0),
      child: Center(
        child: FractionallySizedBox(
          widthFactor: 0.6,
          child: Container(
            decoration: BoxDecoration(color: Color.fromARGB(255, 189, 177, 177)),
            child:DropdownButton(
                  hint: Text("   " + name),
                  isExpanded: true,
                  items: [
                    DropdownMenuItem(child: Text('Audi'), value: 'Audi'),
                    DropdownMenuItem(child: Text('BMW'), value: 'BMW'),
                    DropdownMenuItem(child: Text('Yugo'), value: 'Yugo'),
                  ],
                  onChanged: (value) {
                    ref.read(selectValueProvider(name).notifier).update((state) => value!);
                 //   print('ji: '+ref.read(selectValueProvider(name)));
                  },
                  
                  
            ),
          ),
        ),
      ),
    );
  }
}

Tried to use different states like StateProvider.autodispose but error is the same.

2

Answers


  1. It will be better to use nullable String on selectValueProvider while we dont the selected value.

    final selectValueProvider =
        StateProviderFamily<String?, String>((ref, arg) => null);
    

    And the DropdownButton will be

    DropdownButton(
      hint: Text(" " + name),
      value: ref.watch(selectValueProvider(name)),// updated value
      isExpanded: true,
      items: const [
        DropdownMenuItem(child: Text('Audi'), value: 'Audi'),
        DropdownMenuItem(child: Text('BMW'), value: 'BMW'),
        DropdownMenuItem(child: Text('Yugo'), value: 'Yugo'),
      ],
      onChanged: (value) {
        ref
            .read(selectValueProvider(name).notifier)
            .update((state) => value);
       
      },
    ),
    
    Login or Signup to reply.
  2. Try using the following provider:

    final selectValueProvider =
        AutoDisposeStateProviderFamily<String, String>((ref, arg) {
      return '';
    });
    

    Consider "nulling" the returning value.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search