fluttergetxwebsockets-要級聯到提供者和控制器的流資料

目標很簡單

• flutter 應用程式通過 websockets 呼叫 graphql api
• 應用視圖呼叫控制器，控制器呼叫提供者，提供者通過 websockets 或 HTTP api 套接字呼叫呼叫 AWS appsync api
• 我們不時從后端通過 websockets 接收來自 appsync api 或 HTTP api 套接字呼叫的資料流
• 流需要級聯回 provider ，然后到控制器（這是關鍵步驟）
• 控制器（不是提供者）將更新 obs 或反應變數，使 UI 反映更改

問題：資料是通過呼叫者中的 websockets 接收的，但從未作為流傳遞回提供者或控制器以反映更改

示例代碼

實際呼叫方 orderdata.dart

  @override
  Stream<dynamic> subscribe({
    String query,
    Map<String, dynamic> variables,
  }) async* {
    debugPrint('===->subscribe===');
    // it can be any stream here, http or file or image or media
    final Stream<GraphQLResponse<String>> operation = Amplify.API.subscribe(
      GraphQLRequest<String>(
        document: query,
        variables: variables,
      ),
      onEstablished: () {
        debugPrint(
          '===->subscribe onEstablished ===',
        );
      },
    );

    operation.listen(
      (event) async* {
        final jsonData = json.decode(event.data.toString());
        debugPrint('===->subscription data $jsonData');
        yield jsonData;
      },
      one rror: (Object e) => debugPrint('Error in subscription stream: $e'),
    );
  }

在提供者 orderprovider.dart 中

  Stream<Order> orderSubscription(String placeId) async* {
    debugPrint('===->=== $placeId');
    subscriptionResponseStream = orderData.subscribe(
      query: subscribeToMenuOrder,
      variables: {"place_id": placeId},
    );

    subscriptionResponseStream.listen((event) async* {
      debugPrint(
        "===->=== yielded $event",
      );
      yield event;
    });
    debugPrint('===->=== finished');
  }

在控制器 homecontroller.dart 中

  Future<void> getSubscriptionData(String placeId) async {
    debugPrint('===HomeController->getSubscriptionData===');
    OrderProvider().orderSubscription(placeId).listen(
          (data) {
            //this block is executed when data event is receivedby listener
            debugPrint('Data: $data');
            Get.snackbar('orderSubscription', data.toString());
          },
          one rror: (err) {
            //this block is executed when error event is received by listener
            debugPrint('Error: $err');
          },
          cancelOnError:
              false, //this decides if subscription is cancelled on error or not
          onDone: () {
            //this block is executed when done event is received by listener
            debugPrint('Done!');
          },
        );
  }

homeview 呼叫 homecontroller

uj5u.com熱心網友回復：

嘗試使用map來轉換 Streams：

 @override
  Stream<dynamic> subscribe({
    String query,
    Map<String, dynamic> variables,
  }) {
    debugPrint('===->subscribe===');
    // it can be any stream here, http or file or image or media
    final Stream<GraphQLResponse<String>> operation = Amplify.API.subscribe(
      GraphQLRequest<String>(
        document: query,
        variables: variables,
      ),
      onEstablished: () {
        debugPrint(
          '===->subscribe onEstablished ===',
        );
      },
    );
    
    return operation.map((event) {
      return json.decode(event.data);
    });
  }

  // elsewhere

  final subscription = subscribe(
    query: 'some query', 
    variables: {},
  );

  subscription.listen(
    (jsonData) {
      debugPrint('===->subscription data $jsonData');
    },
    one rror: (Object e) => debugPrint('Error in subscription stream: $e'),
  );

標籤：扑 镖 溪流 颤振-getx 飞镖流

上一篇：FlutterElevatedButton自定義樣式

下一篇：如何在RowFLutter中使用串列