劃重點：

 1 <template>
 2 <div>
 3 <!--<div>子頁面</div>-->
 4 <divclass="mess">
 5 <divv-for="(item,index)inmessage":key="index">
 6 {{item.id}}
 7 </div>
 8 </div>
 9 <div>
10
 
 <button@click="addFont()">點選+</button>
11 <button@click="minus()">點選-</button>
12 </div>
13 </div>
14 </template>
15 <script>
16 exportdefault{
17 name:"shopping",
18 props:{
19 message:{
20 type:Array,
21 default:function(){
22 return[]
23 }
24 },
25 },
26
 
 data(){
27 return{
28 fontSize:0,
29 }
30 },
31 methods:{
32 addFont(){
33 if(this.fontSize<=0){
34 this.fontSize=1;
35 }else{
36 this.fontSize++;
37 }
38 this.$emit('addnum',this.fontSize);
39 },
40 minus(){
41 if(this.fontSize<=0){
42 this.fontSize=0
43 }else{
44 this.fontSize--
45 }
46 this.$emit('minusNum',this
 
.fontSize);
47 }
48 },
49 }
50 </script>

 1 <template>
 2 <divclass="comment">
 3 <div>comment</div>
 4 <divclass="btn">
 5 <router-link:to='{name:"shopping",query:{id:userID}}'@click="tiao()"tag="span">跳轉</router-link>
 6 </div>
 7 <divclass="num">{{num}}</div>
 8 <shopping:message="HelloWorld"@addnum='addNum'@minusNum="minusNum"></shopping>
 9 </div>
10 </template>
11 <script>
12 importshoppingfrom'../shopping/shopping'
13 exportdefault{
14 name:"comment",
15 components:{shopping},
16 data(){
17 return{
18 userID:1,
19 num:0,
20 HelloWorld:[
21 {id:"a"},
22 {id:"b"},
23 {id:"c"},
24 ]
25 }
26 },
27 methods:{
28 addNum(data){
29 this.num=data
30 },
31 minusNum(data){
32 this.num=data
33 }
34 },
35 }
36 </script>