I'm using a basic Deepstream setup with RethinkDB, but for some reason the delete event is never emitted when a record is deleted?
var x = window.deepstream.record.getRecord('test1');
x.subscribe(function(){
console.log('was deleted')
})
window.setTimeout(function(){
console.log('deleting');
x.delete();
},2000);
The "something happened" text never ouputs... Is this expected behavior?
It looks like subscribe does not actually listen for the delete event, I needed to specifically do:
x.on('delete', function(){
console.log('was deleted')
})
Related
I am trying to figure it out if there is a function in the Bacon.js API that allows to subscribe to an EventStream and when the first event fires up, the handle is unsubscribed. The way to do it that I know is the following:
let stream = new Bacon.Bus();
stream.onValue(val => {
doSomething(val);
return Bacon.noMore;
});
But is there something like stream.onValueOnce that automatically unsubscribe the handler after it is executed?
I also know that there is the Bacon.once that creates a EventStream that returns a single value and then ends the stream but this is not what I am looking for.
Update
As Bless Yahu sais, take or first methods can be used. To be more specific, you have to call it from the created eventStream like that:
let stream = new Bacon.Bus();
stream.first().onValue(val => {
doSomething(val);
});
Here is a fiddle that shows it:
https://fiddle.jshell.net/3kjtwcwy/
How about stream.take(1)? https://baconjs.github.io/api.html#observable-take
Or stream.first()? https://baconjs.github.io/api.html#observable-first
I am using redux-observable and this is what I am trying to do.
When an actiontype of 'APPLY_SHOPPING_LIST' comes in dispatch 'APPLYING_SHOPPING_LIST' and after 5 seconds dispatch 'APPLIED_SHOPPING_LIST'. This is the code that I have come up with so far
const applyingShoppingListSource = action$.ofType('APPLY_SHOPPING_LISTS').mapTo({ type: 'APPLYING_SHOPPING_LISTS' });
const applyingShoppingListSourceOther = action$.ofType('APPLY_SHOPPING_LISTS').mapTo({ type: 'APPLIED_SHOPPING_LISTS' }).delay(5000);
const concatList = applyingShoppingListSource.concat(applyingShoppingListSourceOther);
return concatList;
Now the problem is that only 'APPLYING_SHOPPING_LISTS' gets fired, the 'APPLIED_SHOPPING_LISTS' does not get fired to the reducer at all. Am I missing something here?
Just to add to this, when I used flatMap it worked, given below is the code
return action$.ofType('APPLY_SHOPPING_LISTS')
.flatMap(() => Observable.concat(Observable.of({ type: 'APPLYING_SHOPPING_LISTS' }), Observable.of({ type: 'APPLYING_SHOPPING_LISTS' });
I am confused how this works and the other does not?
There's a couple issues. Since Observables are lazy, your second action$.ofType('APPLY_SHOPPING_LISTS') for applyingShoppingListSourceOther is being concat'd after the first applyingShoppingListSource, so it won't be listening for APPLY_SHOPPING_LISTS until after the first one is has completed, but it will never realistically complete because you're taking all actions that match, forever.
Said another way, your code does this:
Start listening for APPLY_SHOPPING_LISTS and when received map it to APPLYING_SHOPPING_LISTS
When that first Observable completes (it never does) start listening for APPLY_SHOPPING_LISTS again, this time when received map it to APPLIED_SHOPPING_LISTS but wait 5000 ms before emitting it.
You could solve the particular issue of the first not ever completing by using .take(1) or .first() (same thing), but you usually need to write your epics to not ever stop listening so they respond to actions at any time.
I think what you want is this:
const exampleEpic = action$ =>
action$.ofType('APPLY_SHOPPING_LISTS')
.mergeMap(() =>
Observable.of({ type: 'APPLYING_SHOPPING_LISTS' })
.concat(
Observable.of({ type: 'APPLIED_SHOPPING_LISTS' })
.delay(5000)
)
);
I used mergeMap but you may want to use switchMap to cancel any previously pending APPLIED_SHOPPING_LISTS that haven't emitted yet. Your call.
I have read that nextTick allows codes to be executed at the next action. But this does not work in my code, can someone helps me on this? Please correct me. Thanks.
.vue
.....
methods:{
getUserInfo(){
var vm = this
vm.$http.get('/getAuthUser').then((response)=>{
vm.user = response.data
})
Vue.nextTick(()=>{
vm.$http.get('/getShop/'+vm.user.id).then((response)=>{
vm.shop = response.data.data.shop
})
})
},
}
.....
{{user.id}} does work. where this gives me the following error:
GET http://localhost:8000/getShop/undefined 404 (Not Found)
EDIT#1
if i do something like this it works but this should not be the right way to do in my opinion.
.....
methods:{
getUserInfo(){
var vm = this
vm.$http.get('/getAuthUser').then((response)=>{
vm.user = response.data
vm.$http.get('/getShop/'+vm.user.id).then((response)=>{
vm.shop = response.data.data.shop
})
})
},
}
.....
EDIT#2
If I do something like this it wont work coz vm.user.id is not set.
.....
methods:{
getUserInfo(){
var vm = this
vm.$http.get('/getAuthUser').then((response)=>{
vm.user = response.data
})
vm.$http.get('/getShop/'+vm.user.id).then((response)=>{
vm.shop = response.data.data.shop
})
},
}
.....
I think your understanding of what nextTick does is incorrect. If you read the documentation, it says that the callback you pass to the nextTick function will be executed after the next DOM update.
Let's say you have a property that determines whether an element exists or not in the DOM with a v-if directive. If you change the value of the property so that the element exists in the DOM, you might have to wait for Vue to process the change and update the DOM before you can grab a reference of that element, for example. In that case, you should use Vue.nextTick to make sure by the time you want to query the DOM to get that element, it actually exists.
Your scenario doesn't have anything to do with the DOM.
You have 2 asynchronous HTTP calls that you want to execute one after another, because the second relies on the result of the first. Your original implementation and third one (EDIT#2) are flaky because you don't make sure the first HTTP request is complete before firing the second one, which explains why you get errors about vm.user.id not being set.
Your second implementation (EDIT#1) is more correct because the second HTTP request is fired after the first one completes. Still, I'd suggest a minor modification:
getUserInfo() {
vm.$http.get('/getAuthUser')
.then(response => {
vm.user = response.data;
return vm.$http.get('/getShop/' + vm.user.id);
}).then(response => {
vm.shop = response.data.data.shop;
});
}
The first callback returns a Promise which result is fed into the second then call. I like this approach because it avois having nested thens. I would also suggest you to read the MDN docs on Promises.
I have a createTable function that receives a collection of nodes (or an array of nodes), then I am able to draw a table.
I am switching to cytoscape.js now, and I really don't know how to have a listener to my select event properly.
Doing this:
cy.on('select', 'node', function(event){
window["selectedNodes"] = cy.$('node:selected');
});
I do have all information I need to draw my table, but I cannot call my createTable function inside it because it will call my function several times (once per node selected).
I've already tried to use cy.on and cy.once, but without success.
Here is my question:
How can I have a listener to my selection event, get ALL selected nodes and call (only once) my createTable function ?
I can also obtain all selected node using this:
cy.elements('node:selected', console.log("my CallBack function"));
But as it is outside an event listener (select / click) it doesn't work as I need.
Please, any help is appreciated.
Thank you.
Debounce your callback so if multiple events come in one after another, then they are effectively batched:
var timeout;
cy.on('select', 'node', function(event){
clearTimeout( timeout );
timeout = setTimeout(function(){
window["selectedNodes"] = cy.$('node:selected');
// and so on...
}, 100); // may have to adjust this val
});
I get a notification when a html page is loaded
-> onStateChange, stateFlags: STATE_IS_NETWORK + STATE_STOP
but I need a notification when the page ist loaded and a onload script has finished running.
Any hints ?
THX
Maybe you could add a second listener to "load" events. I was not able to find any documentation confirming that events listeners are called in order they are set, but some experiments with the code below shows that it seems to be the case. If there was a race condition I would expect to see sometimes "AB" and sometimes "BA":
<input type="text" id="field"/>
<script>
var t = document.getElementById("field");
t.value="";
function a(e) {
t.value = t.value + "A";
}
function b(e) {
t.value = t.value + "B";
}
window.addEventListener("load", a, false);
window.addEventListener("load", b, false);
</script>
One thing to be careful with this is that if you add the second event listener too late (i.e. the load event already fired) it will not be called.
Anyway, feels like a hack, but is just an idea in case you cannot find a better way to handle it.
You could use:
gBrowser.addEventListener("DOMContentLoaded", function()
{
// Page content is loaded
}, false);
but remember that gBrowser refers to the content of a tab so this will check every tab when it has been selected