如何使用riverpod在开发中创建通用组件？

问题描述

我在Flutter开发中使用riverpod进行状态管理。
我现在正在尝试创建一个需要状态管理的通用组件。
我使用riverpod制作了一个通用组件，如下代码。

class InputTextareaModel with ChangeNotifier {
  String text;
  String error;

  String Function(String text) _validator;
  void Function(String text) _onChanged;
  bool _autovalidation;

  set validator(String Function(String text) validator) {
    this._validator = validator ?? (String text) => null;
  }

  set onChanged(void Function(String text) onChanged) {
    this._onChanged = onChanged ?? (String text) {};
  }

  set autovalidation(bool autovalidation) {
    this._autovalidation = autovalidation ?? true;
  }

  InputTextareaModel() {
    this.text = '';
    this.error = null;
  }

  onChangedText(String value) {
    this.text = value;
    this._onChanged(value);
    if (this._autovalidation) {
      this.onValidation();
    }
    notifyListeners();
  }

  onValidation() {
    this.error = this._validator(this.text);
    notifyListeners();
  }

  bool isError() {
    return this.error != null ? true : false;
  }
}

class InputTextarea extends HookWidget {
  final String label;
  final int minLines;
  final int maxLines;
  final String placeholder;
  final provider;
  final String Function(String text) validator;
  final void Function(String text) onChanged;
  final bool autovalidation;

  InputTextarea(
      {Key key,this.label,this.placeholder,provider,this.validator,this.onChanged,this.autovalidation,this.minLines = 3,this.maxLines = 5})
      : this.provider =
            provider ?? ChangeNotifierProvider((_) => InputTextareaModel()),super(key: key);

  @override
  Widget build(BuildContext context) {
    final inputTextareaModel = useProvider<InputTextareaModel>(provider);
    inputTextareaModel.validator = this.validator;
    inputTextareaModel.onChanged = this.onChanged;
    inputTextareaModel.autovalidation = this.autovalidation;
    return TextField(
      decoration: Inputdecoration(
        alignLabelWithHint: true,labelText: this.label,hintText: this.placeholder,errorText: inputTextareaModel.error,border: OutlineInputBorder(),),keyboardType: TextInputType.multiline,minLines: this.minLines,maxLines: this.maxLines,onChanged: (value) {
        inputTextareaModel.onChangedText(value);
      },);
  }
}

我用这样的代码调用这个通用组件：

final messageProvider =
    ChangeNotifierProvider.autodispose((_) => InputTextareaModel());


InputTextarea(
  minLines: 5,label: "message",placeholder: "test",provider: messageProvider,// We are injecting the provider at here.
  validator: (value) {
    if (value.replaceAll("\n","").isEmpty) {
      return 'required message!';
    }
    return null;
  },

我也可以通过这种方式创建一个通用组件，但我对此不太满意。
感觉用riverpod创建通用组件有更好的方法。
还是使用 statefulWidget 等创建它而不使用 riverpod 更好？
如果你知道任何好的方法，请告诉我！

谢谢。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

dart riverpod