Complete Vue.js 2 Web Development_ Practical guide to building end-to-end web development solutions with Vue.js 2

(singke) #1
Integrating with Other Frameworks Chapter 19

How it works...


Our application uses a pattern called reactive. Its core can be clearly seen in the handle
created:


entries.order('datetime', 'descending').limit(10).watch()
.subscribe(allEntries => {
this.entries = [...allEntries].reverse()
})

The first line returns what is called an observable in reactive. An observable can be thought


of as a source of events. Every time an event is fired, the subscriber to that source will
process it. In our case, we are taking the whole entries collection and the events thrown are


modifications to that collection. Every time we receive an event of this type, we update the
entries array.


I will not provide a deep explanation of reactive programming here, but I would like to
highlight that this pattern is very helpful for scalability because of the ease with which you


can implement controls for your data flow; limit(10) is an example this.

Free download pdf