标签: eventemitter

Angular 双向数据绑定和观察父组件的变化

使用双向数据绑定时,似乎没有办法观察父组件的变化。

我有一个用于收集标签列表的自定义输入组件。双向数据绑定在此组件与其父组件之间设置和工作。

// the parent component is just a form
// here is how I'm adding the child component
<input-tags formControlName="skillField" [(tags)]='skillTags' (ngModelChange)="skillTagUpdate($event)">
</input-tags>
Run Code Online (Sandbox Code Playgroud)

在父组件中,如何观察绑定变量的变化?虽然它总是最新的(我已经确认了这一点),但我找不到任何关于对变化做出反应的指导。

我试过了:

ngOnChanges(changes: SimpleChanges) {
    if (changes['skillTags']) {
        console.log(this.skillTags);  // nothing
    }
}
Run Code Online (Sandbox Code Playgroud)

skillTagUpdate(event){
    console.log(event); // nothing
}
Run Code Online (Sandbox Code Playgroud)

更新: TWDB 恕我直言不是它所宣传的那样。每当我到达 TWDB 似乎是一个解决方案的地方时,我都会重新设计服务和/或可观察的通信。

eventemitter angular two-way-binding controlvalueaccessor

11
推荐指数
2
解决办法
5580
查看次数

EventEmitter vs facebook的调度员

我正在使用Flux架构的反应.
我在网上看到,为了定义Store,我必须做类似的事情:

var AppDispatcher = require('../dispatcher/dispatcher'), //facebook's dispatcher
    EventEmitter = require('events').EventEmitter,
    assign = require('object-assign');

var MyStore = assign({}, EventEmitter.prototype, {
   .....
Run Code Online (Sandbox Code Playgroud)

据我了解,EventEmitter和facebook的调度员有很多共同之处.例如,两者都可以发出(或发送)一个事件.
我的问题是为什么我需要EventEmitter和调度程序?这不是多余的吗?创建一个包含EventEmitter所需行为的调度程序不是更好吗?

javascript node.js eventemitter reactjs reactjs-flux

10
推荐指数
1
解决办法
2183
查看次数

如何使用elixir创建一个事件发射器,otp方式

在elixir中创建前景过程的最佳方法是什么,该过程在每个给定的时间内打勾?

我的主要问题是这样的方法:

defmoulde Ticker do
  def tick do
    do_something()
    :timer.sleep(1000)
    tick
  end
end
Run Code Online (Sandbox Code Playgroud)

工作,但设计错了.它肯定不会每秒都在滴答作响,但是每秒都会增加do_something()的时间.我可以产生一个处理"某事"的过程,但仍有一个小的滞后.

此外,我正在尝试构建一个混合应用程序,有一些GenServers参与,以及一个主要的前台进程(我在这里问的那个)应该每隔x秒调用一次服务器.有这样的otp方式吗?

elixir erlang-otp eventemitter

10
推荐指数
1
解决办法
805
查看次数

如何解决反应本机EventEmitterListener警告

我正在使用事件发射器在地图组件和工具栏之间进行通信.注意*我在我的应用程序的其他部分使用相同的代码没有问题.我得到的错误是:

警告:setState(...):只能更新已安装或安装的组件.这通常意味着您在已卸载的组件上调用了setState().这是一个无操作.请检查未定义组件的代码.

我试图通过类似的帖子解决这个问题,但它不起作用.我认为它与两个组件中的mount && unmount方法有关?

工具栏组件

        componentDidMount() {
    this.showLocateIconListener = AppEventEmitter.addListener('isTrip', this.isTrip.bind(this));
    this.endTripListener = AppEventEmitter.addListener('showLocateIcon', this.showLocateIcon.bind(this));
    this.endSubdivisionIcon = AppEventEmitter.addListener('showSubdivisionIcon', this.showSubdivisionIcon.bind(this));
}

componentWillUnMount() {
    this.showLocateIconListener.remove();
    this.endTripListener.remove();
    this.endSubdivisionIcon.remove();
}


 //// this is where the error is happening
showSubdivisionIcon(val) {
    if (val != 0)
        this.setState({
            items: menuSubdivision,
            subdivisionId: val
        })
    else
        this.setState({
            items: menu
        })
}
Run Code Online (Sandbox Code Playgroud)

地图组件

  onMarkerPress(val) {
    AppEventEmitter.emit('showSubdivisionIcon', val.id);
}
Run Code Online (Sandbox Code Playgroud)

EventEmitter.js的控制台错误详细信息导致了这一点

  subscription.listener.apply(
        subscription.context,
        Array.prototype.slice.call(arguments, 1)
      );
Run Code Online (Sandbox Code Playgroud)

EventEmitter.js中的完整部分

      /**
   * Emits an event of the given type with the given data. All …
Run Code Online (Sandbox Code Playgroud)

javascript node.js eventemitter reactjs react-native

10
推荐指数
1
解决办法
1645
查看次数

React Hooks useState + useEffect + event给出陈旧状态

我正在尝试将事件发射器与React useEffect和一起使用useState,但是它始终获取初始状态而不是更新状态。如果我直接调用事件处理程序,即使使用,也可以使用setTimeout

如果将值传递给useEffect()第二个参数,它将使其起作用,但是,每当值更改时(这是击键触发的),这都会导致事件发射器重新订阅。

我究竟做错了什么?我试过useStateuseRefuseReducer,和useCallback,并不能得到任何工作。

这是复制品:

import React, { useState, useEffect } from "react";
import { Controlled as CodeMirror } from "react-codemirror2";
import "codemirror/lib/codemirror.css";
import EventEmitter from "events";

let ee = new EventEmitter();

const initialValue = "initial value";

function App(props) {
  const [value, setValue] = useState(initialValue);

  // Should get the latest value, both after the initial server load, and whenever the Codemirror input changes.
  const handleEvent …
Run Code Online (Sandbox Code Playgroud)

javascript codemirror eventemitter reactjs react-hooks

10
推荐指数
1
解决办法
3685
查看次数

JQuery触发自定义事件会导致错误

我有一个人对象,我基本上希望它能够发出自己的事件.但是,如果触发事件与原型具有相同的名称,则Chrome会打印出相当大的错误.在下面的代码示例中, person.murder触发murder将错误写入控制台的事件.(代码更有意义).

function Person() {

}

Person.prototype.murder = function() {
   $(this).trigger("murder");
}
Run Code Online (Sandbox Code Playgroud)

我像这样调用触发器

var barry = new Person();
$(barry).on("murder", function(){
   alert("I am so angry");
})

barry.murder();
Run Code Online (Sandbox Code Playgroud)

因此谋杀巴里导致错误,但是如果事件是这样的事情personDied,那么没有错误.我是否正确地触发了事件?我只是想毫无错误地杀人.

有时会返回错误的崩溃<error>,有时甚至

未捕获RangeError:超出最大调用堆栈大小

javascript jquery javascript-events eventemitter

9
推荐指数
1
解决办法
1172
查看次数

React Flux调度程序与Node.js EventEmitter - 可扩展?

使用Node的EventEmitter时,您订阅了一个事件.您的回调仅在该特定事件被触发时执行:

eventBus.on('some-event', function(data){
   // data is specific to 'some-event'
});
Run Code Online (Sandbox Code Playgroud)

在Flux中,您使用调度程序注册商店,然后在调度每个事件时调用您的商店.商店的工作是过滤它获得的每个事件,并确定事件对于商店是否重要:

eventBus.register(function(data){
   switch(data.type){
      case 'some-event':
            // now data is specific to 'some-event'
         break;
   }
});
Run Code Online (Sandbox Code Playgroud)

在此视频中,演示者说:

"商店订阅行动.实际上,所有商店都接收所有行动,这就是保持其可扩展性的因素."

为什么以及如何将每个操作发送到每个商店[可能]比仅向特定商店发送操作更具可扩展性?

design-patterns flux node.js eventemitter reactjs

9
推荐指数
1
解决办法
2862
查看次数

Angular2 EventEmitter和preventDefault()

Angular2中有没有办法以某种方式阻止使用EventEmitter的事件的默认值?

我有以下场景:

import {Component, Output, EventEmitter} from 'angular2/core'

@Component({
  selector: 'my-component',
  template: `<button (click)="clickemitter.emit($event); onClick($event)" [style.color]="color"><ng-content></ng-content></button>`
})
export class MyComponent {
  @Output clickemitter: EventEmitter<MouseEvent> = new EventEmitter();

  private color: string = "black";

  constructor() {

  }

  private onClick(event: MouseEvent): void {
    if(!event.defaultPrevented) //gets called before the observers of clickemitter
      this.color = "red";
    else this.color = "blue";
  }
}

@Component({
  selector: 'my-app',
  providers: [],
  template: `
    <my-component (clickemitter)="$event.preventDefault()">Hello Angular</my-component>
  `,
  directives: [MyComponent]
})
export class App {
  constructor() {

  }
}
Run Code Online (Sandbox Code Playgroud)

我做了一个Plunker这一点,太: …

preventdefault eventemitter angular

9
推荐指数
3
解决办法
3万
查看次数

我什么时候应该使用EventEmitter?

我读了很多关于的事情EventEmitter.但我不知道在哪种情况下我需要在我的Node.js应用程序中使用它.

javascript node.js eventemitter

9
推荐指数
2
解决办法
1802
查看次数

在使用Flow扩展EventEmitter的类中限制`eventName`的类型?

举个例子,假设我有一个类只有发出三种可能的事件-  'pending''success''failure'.此外,接收的参数类型eventHandler取决于发出的事件 -

  • 如果'pending',eventHandler没有收到任何论据
  • 如果'success',eventHandler收到一个number
  • 如果'failure',eventHandler收到一个Error

以下是我尝试建模的方法:

// @flow

import EventEmitter from 'events'

type CustomEventObj = {|
  pending: void,
  success: number,
  error: Error
|}

declare class MyEventEmitter extends EventEmitter {
  on<K: $Keys<CustomEventObj>>(
    eventName: K,
    eventHandler: (
      e: $ElementType<CustomEventObj, K>, 
      ...args: Array<any>
    ) => void
  ): this
}
Run Code Online (Sandbox Code Playgroud)

但是,这会导致如下错误:

Error ????????????????????????????????????????????????????????????????????????????????????????????????????? test.js:12:3

Cannot extend EventEmitter [1] with MyEventEmitter because an …
Run Code Online (Sandbox Code Playgroud)

javascript eventemitter flowtype flow-typed

9
推荐指数
1
解决办法
242
查看次数