使用双向数据绑定时,似乎没有办法观察父组件的变化。
我有一个用于收集标签列表的自定义输入组件。双向数据绑定在此组件与其父组件之间设置和工作。
// 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 似乎是一个解决方案的地方时,我都会重新设计服务和/或可观察的通信。
我正在使用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所需行为的调度程序不是更好吗?
在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方式吗?
我正在使用事件发射器在地图组件和工具栏之间进行通信.注意*我在我的应用程序的其他部分使用相同的代码没有问题.我得到的错误是:
警告: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) 我正在尝试将事件发射器与React useEffect和一起使用useState,但是它始终获取初始状态而不是更新状态。如果我直接调用事件处理程序,即使使用,也可以使用setTimeout。
如果将值传递给useEffect()第二个参数,它将使其起作用,但是,每当值更改时(这是击键触发的),这都会导致事件发射器重新订阅。
我究竟做错了什么?我试过useState,useRef,useReducer,和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)我有一个人对象,我基本上希望它能够发出自己的事件.但是,如果触发事件与原型具有相同的名称,则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:超出最大调用堆栈大小
使用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)
在此视频中,演示者说:
"商店订阅行动.实际上,所有商店都接收所有行动,这就是保持其可扩展性的因素."
为什么以及如何将每个操作发送到每个商店[可能]比仅向特定商店发送操作更具可扩展性?
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这一点,太: …
我读了很多关于的事情EventEmitter.但我不知道在哪种情况下我需要在我的Node.js应用程序中使用它.
举个例子,假设我有一个类只有发出三种可能的事件- '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) eventemitter ×10
javascript ×6
node.js ×4
reactjs ×4
angular ×2
codemirror ×1
elixir ×1
erlang-otp ×1
flow-typed ×1
flowtype ×1
flux ×1
jquery ×1
react-hooks ×1
react-native ×1
reactjs-flux ×1