Integrating with Other Frameworks Chapter 19})
reader.readAsDataURL(file)
}
},
...Then when we press the send button, we tell the Horizon collection of entries to store this
new one:
...
send(concept) {
entries.store({
text: concept,
datetime: new Date()
}).subscribe(
result => console.log(result),
error => console.log(error)
)
this.tentativeEntries = []
this.$refs.file.value = ''
this.data_uri = undefined
}
}
})Finally, we want to ensure that we have the last ten entries on the screen when the page
loads and that every time a new entry is added, it pops up in real time. Add the following
hook inside the Vue instance, after the methods:
created() {
entries.order('datetime', 'descending').limit(10).watch()
.subscribe(allEntries => {
this.entries = [...allEntries].reverse()
})
}To run the Horizon server, use the following command:
hz serve --dev