【问题标题】:how to display a websocket data in flutter with getx如何使用getx显示websocket数据
【发布时间】:2021-01-24 19:53:25
【问题描述】:

我想在 ListDemo 小部件上使用 getx 的套接字值实时显示数据,但我无法实现

// socket.dart
class WebSocket {
  final hubConnection = HubConnectionBuilder().withUrl(EnvironmentHml.socketUrlFake).build();
  SocketController socketController = Get.put(SocketController());
  createWS() async {
    await hubConnection.start();
    hubConnection.on("ReceiveMessage", listenWSMessages);
  }

  listenWSMessages(List<Object> result) { // simple ws listener
    socketController.wsData = result[1];
  }
}
// socket_controller.dart
class SocketController extends GetxController {
  var wsData = ''.obs;
}

我的小部件:

class ListDemo extends StatelessWidget {
  final ListDemoController listDemoController = Get.put(ListDemoController());
  @override
  Widget build(BuildContext context) {
    return Container(
      child: Text('display data here'),
    );
  }
}

小部件控制器:

class ListDemoController extends GetxController {
  WebSocket webSocket = WebSocket(); // create a websocket
  @override
  void onInit() {
    super.onInit();
    webSocket.createWS(); // start websocket
  }
}

websocket 连接有效,但此时我不知道该怎么做

【问题讨论】:

    标签: flutter websocket flutter-get


    【解决方案1】:

    好的,我终于得到了解决方案,基本上我所做的是:

    // socket.dart
      listenWSMessages(List<Object> result) {
        socketController.wsData.value = result[1]; // add .value
      }
    
    // list_demo_controller.dart
    class ListDemoController extends GetxController {
      WebSocket webSocket = WebSocket();
      var data = ''.obs; // create this variable
      @override
      void onInit() {
        super.onInit();
        webSocket.createWS();
        data = webSocket.socketController.wsData; // add this line
      }
    }
    
    // finally in list_demo.dart
    class ListDemo extends StatelessWidget {
      final ListDemoController listDemoController = Get.put(ListDemoController());
      @override
      Widget build(BuildContext context) {
        return Container(
          child: Obx(() => Text("${listDemoController.data}")), // add this line
        );
      }
    }
    

    字体:https://pub.dev/packages/get

    【讨论】:

    • 可能是我得到的最糟糕的解决方案,如果有更好的解决方案请告诉我
    猜你喜欢
    • 1970-01-01
    • 2021-01-07
    • 2021-02-18
    • 2021-10-17
    • 2021-10-01
    • 2022-11-08
    • 2021-10-10
    • 2019-12-20
    • 2022-07-01
    相关资源
    最近更新 更多