質問編集履歴
1
質問の追加
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -499,3 +499,143 @@
|
|
|
499
499
|
}
|
|
500
500
|
|
|
501
501
|
```
|
|
502
|
+
|
|
503
|
+
|
|
504
|
+
|
|
505
|
+
↓ここから追記
|
|
506
|
+
|
|
507
|
+
足りないbabel-presetをinstallしてbuildしたところ、Failed to mount component: template or render function not defined.というエラーが出ました。よければこちらのエラーの原因も教えていただけると幸いです。
|
|
508
|
+
|
|
509
|
+
timetable.vueというタイムテーブルを表示する単一ファイルコンポーネントをnewsPage.vue（名前は気にしないでください）というページにexportしています。
|
|
510
|
+
|
|
511
|
+
|
|
512
|
+
|
|
513
|
+
↓newsPage.vue
|
|
514
|
+
|
|
515
|
+
```
|
|
516
|
+
|
|
517
|
+
<template>
|
|
518
|
+
|
|
519
|
+
<v-ons-page>
|
|
520
|
+
|
|
521
|
+
<custom-toolbar :title="'News'" :action="toggleMenu"></custom-toolbar>
|
|
522
|
+
|
|
523
|
+
<p style="text-align: center">
|
|
524
|
+
|
|
525
|
+
Some news here.
|
|
526
|
+
|
|
527
|
+
</p>
|
|
528
|
+
|
|
529
|
+
|
|
530
|
+
|
|
531
|
+
<table></table>
|
|
532
|
+
|
|
533
|
+
|
|
534
|
+
|
|
535
|
+
</v-ons-page>
|
|
536
|
+
|
|
537
|
+
</template>
|
|
538
|
+
|
|
539
|
+
|
|
540
|
+
|
|
541
|
+
<script>
|
|
542
|
+
|
|
543
|
+
import Vue from 'vue'
|
|
544
|
+
|
|
545
|
+
import customToolbar from './toolbar'
|
|
546
|
+
|
|
547
|
+
import Table from './timetable.vue'
|
|
548
|
+
|
|
549
|
+
|
|
550
|
+
|
|
551
|
+
export default {
|
|
552
|
+
|
|
553
|
+
props: ['toggleMenu'],
|
|
554
|
+
|
|
555
|
+
components:{customToolbar , Table}
|
|
556
|
+
|
|
557
|
+
}
|
|
558
|
+
|
|
559
|
+
</script>
|
|
560
|
+
|
|
561
|
+
```
|
|
562
|
+
|
|
563
|
+
|
|
564
|
+
|
|
565
|
+
↓timetable.vue
|
|
566
|
+
|
|
567
|
+
```
|
|
568
|
+
|
|
569
|
+
<template>
|
|
570
|
+
|
|
571
|
+
<div id="app">
|
|
572
|
+
|
|
573
|
+
|
|
574
|
+
|
|
575
|
+
<Schedule
|
|
576
|
+
|
|
577
|
+
:time-ground="['09:00', '18:00']"
|
|
578
|
+
|
|
579
|
+
:week-ground="['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday']"
|
|
580
|
+
|
|
581
|
+
:task-detail="[
|
|
582
|
+
|
|
583
|
+
[
|
|
584
|
+
|
|
585
|
+
{
|
|
586
|
+
|
|
587
|
+
dateStart: '09:30',
|
|
588
|
+
|
|
589
|
+
dateEnd: '10:30',
|
|
590
|
+
|
|
591
|
+
title: '开会',
|
|
592
|
+
|
|
593
|
+
},
|
|
594
|
+
|
|
595
|
+
{
|
|
596
|
+
|
|
597
|
+
dateStart: '11:30',
|
|
598
|
+
|
|
599
|
+
dateEnd: '13:50',
|
|
600
|
+
|
|
601
|
+
title: '开会',
|
|
602
|
+
|
|
603
|
+
}
|
|
604
|
+
|
|
605
|
+
|
|
606
|
+
|
|
607
|
+
]
|
|
608
|
+
|
|
609
|
+
]">
|
|
610
|
+
|
|
611
|
+
|
|
612
|
+
|
|
613
|
+
</Schedule>
|
|
614
|
+
|
|
615
|
+
</div>
|
|
616
|
+
|
|
617
|
+
</template>
|
|
618
|
+
|
|
619
|
+
|
|
620
|
+
|
|
621
|
+
<script>
|
|
622
|
+
|
|
623
|
+
import Vue from 'vue';
|
|
624
|
+
|
|
625
|
+
import Schedule from 'vue-schedule';
|
|
626
|
+
|
|
627
|
+
|
|
628
|
+
|
|
629
|
+
export default{
|
|
630
|
+
|
|
631
|
+
name: 'table',
|
|
632
|
+
|
|
633
|
+
|
|
634
|
+
|
|
635
|
+
components:{ Schedule }
|
|
636
|
+
|
|
637
|
+
}
|
|
638
|
+
|
|
639
|
+
</script>
|
|
640
|
+
|
|
641
|
+
```
|