vuejs
Create successful ePaper yourself
Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.
Components 72<br />
Vue warn: Unknown custom element: - did you register the component correctly?<br />
For recursive components, make sure to provide the “name” option.<br />
To fix this we need to register the Component again. This time we have to make some changes to<br />
the component’s template. We will change plot attribute to body and tag to to suit our<br />
needs.<br />
So, the story’s template will be:<br />
1 <br />
2 <br />
3 {{ story.writer }} said "{{ story.plot }}"<br />
4 <br />
5 <br />
But the component will be the same.<br />
1 Vue.component('story', {<br />
2 props: ['story'],<br />
3 template: '#story-template'<br />
4 });<br />
If you run the above code you will see for yourself that everything works same as before but this<br />
time with the use of a custom component.<br />
Pretty neat huh?<br />
6.6 Altogether now<br />
Using our newly acquired knowledge we should be able to build something a bit more complex.<br />
Taking the structure example from before, we are going to create a voting system for our stories,<br />
and add a favorite feature. The way to accomplish these is through methods, directives, and of<br />
course, components.<br />
Lets start with the stories setup.