dart - Web-UI 组件之间的通信

Question

我是一名菜鸟达蒂森。我已经在https://github.com/mackristof/DartWebComponentCommunication上推送了测试项目。我想找到 2 个 web 组件之间通信的最佳实现。如果用户单击 webComponent 1 上的按钮，如何通知计数器 webcomponent 2？溪流 ？总线事件？

感谢您提供最佳解决方案的拉取请求。

克里斯托夫。

Answer 1

对于这种类型的通信，我实现了一个事件总线，它对我来说非常有用。

如果事件总线是在应用程序级别定义的，您的事件可能看起来像这样；

void increment() {
      eventBus.fire(clickEvent, 1)
}

并且您的计数器组件可以由模型对象支持，例如；

class CounterComponent extends WebComponent {

    int get count => viewModel.count;

    ViewModel viewModel;
}

ViewModel 看起来像

class ViewModel{
    int count;

    ViewModel(){
        eventBus.on(clickEvent).listen((msg){
            count = count + msg;
        });
    }
}

Answer 2

我认为 Web 组件可以使用事件通过父/主机 DOM 相互通信。当一个 Web 组件将触发某个事件时，主机/父 DOM 应该捕获它并通过更改其属性值来通知其他 Web 组件。这种方式我认为 Web 组件可以通信。