Flutter將提供程式作為引數傳遞

我有一個 TemplateView 頁面，它有一個內容引數，該引數托管根據我的應用程式而變化的內容。每個內容都有一個特定的提供者。另一方面，我的 TemplateView 頁面有一個按鈕，它呼叫每個提供程式通用的驗證函式。

這是我的應用程式的示例（綠色是我的 TemplateView，紅色是更改的內容）：

這是模板視圖的簡化代碼。我們看到對內容的呼叫和呼叫內容提供者 ContentView1 的驗證按鈕。

class TemplateView extends StatelessWidget{
  final String title;
  final StatelessWidget content;
  TemplateView ({
        Key? key,
        required this.title,
        required this.content,
        required this.validationMessage,
      }) : super(key: key);

  @override
  Widget build(BuildContext context)
  {
    return GestureDetector(
      onTap: (() => FocusScope.of(context).requestFocus(FocusNode())),
      child: SafeArea(
        child: Scaffold(
          appBar: AppBar(
            title: Text(title),
          ),
          body : _buildBody(context),
        ),
      ),
    );
  }

  Widget _buildBody(BuildContext context)
  {
    // Here the call of my provider for the ContentView1
    var _messageProvider = Provider.of<ContentView1Provider>(context);

    return Column(
      children: [
        SingleChildScrollView(
          child: Container(
            child: content,
          ),
        ),
        InkWell(
            child: Container(
              child: Text('SAVE'),
            ),
            onTap: () => _messageProvider.validation()
        ),
      ],
    );
  }
}

在這里，我如何在我的路由器中呼叫 TemplateView：

case RouterName.kContentView1:
  return CupertinoPageRoute(
      builder: (context) => ChangeNotifierProvider<ContentView1Provider>(
        create: (BuildContext context) => ContentView1Provider(),
        child: TemplateView(
            title: "Content 1 page",
            message: ContentView1(),
        ),
      )
  );

一切都在作業，現在就像我說的內容會改變但我的 TemplateView 很常見。因此，我無法在 TemplateView 中直接輸入對提供者的呼叫，因為它會根據頁面而變化。

所以我想在 TemplateView 設定中呼叫提供者，但它不起作用。

我的新模板視圖：

class TemplateView extends StatelessWidget{
  final String title;
  final StatelessWidget content;
  final Function validationMessage; // => I added this line
  TemplateView({
        Key? key,
        required this.title,
        required this.content,
        required this.validationMessage, // => I added this line
      }) : super(key: key);

  @override
  Widget build(BuildContext context)
  {
    // => I remove the call of the provider line
    return GestureDetector(
      onTap: (() => FocusScope.of(context).requestFocus(FocusNode())),
      child: SafeArea(
        child: Scaffold(
          appBar: AppBar(
            title: Text(title),
          ),
          body : _buildBody(context),
        ),
      ),
    );
  }

  Widget _buildBody(BuildContext context)
  {
    return Column(
      children: [
        SingleChildScrollView(
          child: Container(
            child: content,
          ),
        ),
        InkWell(
            child: Container(
              child: Text('SAVE'),
            ),
            onTap: () => validationMessage() // => I changed this line
        ),
      ],
    );
  }
}

我的新路由器：

case RouterName.kContentView1:
  return CupertinoPageRoute(
      builder: (context) => ChangeNotifierProvider<ContentView1Provider>(
        create: (BuildContext context) => ContentView1Provider(),
        child: TemplateView(
            title: "Content 1 page",
            message: Content1View(),
            validationMessage: () => Provider.of<ContentView1Provider>(context).validation(),
        ),
      )
  );

它不起作用，如何做到這一點？

使用 我在路由器中添加 Consumer的解決方案進行編輯：

case RouterName.kContentView1:
  return CupertinoPageRoute(
      builder: (context) => ChangeNotifierProvider<ContentView1Provider>(
        create: (BuildContext context) => ContentView1Provider(),
        child: TemplateView(
            title: "Content 1 page",
            message: Consumer<ContentView1Provider>(builder :(ctx , provider , child){
              return ContentView1();
            }),
            validationMessage: () => Provider.of<ContentView1Provider>(context).validation(),
        ),
      )
  );

uj5u.com熱心網友回復：

我不確定我是否理解這個案例，但我只是告訴一個想法它是否有效，如果我理解你的要求：在你的路線通行證提供者到模板頁面：

case RouterName.kContentView1:
  return CupertinoPageRoute(
      builder: (context) => ChangeNotifierProvider<ContentView1Provider>(
        create: (BuildContext context) => ContentView1Provider(),
        child: TemplateView(
            provider : ContentView1Provider ,     // add this line
            title: "Content 1 page",
            message: Content1View(),
            validationMessage: () => Provider.of<ContentView1Provider>(context).saveMessage(),
        ),
      )
  );

在模板視圖中接收此提供程式：

class TemplateView extends StatelessWidget{
  final provider;       //  add this line
  final String title;
  final StatelessWidget content;
  final Function validationMessage; // => I added this line
  TemplateView({
        Key? key,
        required this.provider,       //  add this line
        required this.title,
        required this.content,
        required this.validationMessage, // => I added this line
      }) : super(key: key);

現在您可以將 Consumer 與您收到的每個內容的提供者一起使用：

return Consumer<provider>(builder :(ctx , provider , child){
   return //what you want ....;
})

可能我誤解了

標籤：扑 镖 提供者

上一篇：在Dart中輸入相等性-奇怪的行為

下一篇：在顫振中的小部件構建中使用變數