Pass Template Data Through domStreams in Vue.js and RxJS
domStreams enable you to pass additional data along the stream that can be provided by the template (such as data coming from a v-for rendering of an Array). You can then pluck off the data from the stream and use it further down the stream.
Instructor: [00:01] Our domstreams also allow us to pass some data along inside of our configured stream here. If we pass an object along instead of just click, I can say that the subject is the click that's created from the domstream, and the data is just going to be the number one, or this is the id for Luke.
[00:20] If I come down here into my click, I can say pluck the data off, and then map that ID to the string of this, using that ID. I'll hit save here and have the exact same result. What this allows me to do is, if I create three buttons where each of these uses different data -- four is Darth Vader and five is Leia -- I'll just save. Then I can click this one to get Luke, this one to get Darth, and this one to get Leia.
[01:00] Each of these passes a data along. The data comes through the click stream here. You can pluck off the data, and then use that data to map whatever data comes through -- I just named it ID -- pass it along, and use it however you need it.
Member comments are a way for members to communicate, interact, and ask questions about a lesson.
The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io
Be on-Topic
Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.
Avoid meta-discussion
Code Problems?
Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context
Details and Context
Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!