组件:表行组件

知识点

  • 制作表行组件

表行组件

为自己的页面表格编写表行组件。

综合例

  1. <div id="myApp">
  2. <h1>2017年最期待的游戏是:</h1>
  3. <table border="1">
  4. <tr>
  5. <td>编号</td>
  6. <td>游戏名称</td>
  7. </tr>
  8. <my-row1></my-row1>
  9. <my-row2></my-row2>
  10. <my-row3></my-row3>
  11. </table>
  12. </div>
  13. <script>
  14. Vue.component('my-row1', {
  15. template: '<tr><td>(1)</td><td>塞尔达传说:荒野之息(3/3)</td></tr>'
  16. });
  17. Vue.component('my-row2', {
  18. template: '<tr><td>(2)</td><td>新马里奥赛车(4/28)</td></tr>'
  19. });
  20. Vue.component('my-row3', {
  21. template: '<tr><td>(3)</td><td>喷射乌贼娘2代</td></tr>'
  22. });
  23. var myApp = new Vue({
  24. el: '#myApp',
  25. data: {
  26. },
  27. methods: {
  28. },
  29. });
  30. </script>

源文件

小马视频频道

http://komavideo.com