為什么組件自定義事件不能在寫在模板里監(jiān)聽，而屬性又不能寫在組件上綁定？

 <div id="app">
        <p>數(shù)字： {{number}}</p>
        <button @click="plusOne(rand1,$event)">點(diǎn)一下加2</button>
        <customize-btn  @click.native="minus(rand2)"  ></customize-btn>
    </div>
    <script type="text/javascript">
    var rand1=Math.random()*10;
    var rand2=Math.random()*10;
    var customizeBtn = {
        data: function() {
            return { btnClass: "btn" }
        },
        template: ` <div :class="btnClass">這是一個(gè)自定義的組件，讓它擁有點(diǎn)擊事件能力，就像個(gè)按鈕</div>  `,
    }
    var app = new Vue({
        el: "#app",
        data: {
            message: 'hello world',
            number: 3,
            rand1:rand1,
            rand2:rand2
        },
        methods: {
            plusOne: function(num, a) {
               console.log(rand1);
                this.number = this.number + num;
                console.log("隨機(jī)增加一個(gè)數(shù)后的：" + this.number);
                this.rand1=Math.random()*10;
                return this.number;
            },
            minus: function(num) {
                console.log(rand2);
                this.number = this.number - num;
                console.log("隨機(jī)減去一個(gè)數(shù)后的：" + this.number);
                 this.rand2=Math.random()*10;
                return this.number;
            }
        },
        components: {
            "customizeBtn": customizeBtn
        }
    })
    </script>

發(fā)現(xiàn)下面幾個(gè)情況：

1.事件監(jiān)聽和樣式屬性綁定都直接寫在組件標(biāo)簽上

<customize-btn  @click.native="minus(rand2)" :class="btnClass" ></customize-btn>

報(bào)錯(cuò)btnClass未定義

2.事件監(jiān)聽和樣式屬性綁定都直接寫在tempalet里面

template: ` <div  @click.native="minus(rand2)" :class="btnClass">這是一個(gè)自定義的組件，讓它擁有點(diǎn)擊事件能力，就像個(gè)按鈕</div>  `,

不報(bào)錯(cuò)，但是第二個(gè)按鈕點(diǎn)擊無效，事件沒綁上

3.事件監(jiān)聽寫在template，樣式屬性綁定寫在組件標(biāo)簽上

<customize-btn  :class="btnClass" ></customize-btn>
template: ` <div  @click.native="minus(rand2)">這是一個(gè)自定義的組件，讓它擁有點(diǎn)擊事件能力，就像個(gè)按鈕</div>  `,

報(bào)錯(cuò)，btnClass未定義

4.第三種就是最前面的那樣。事件監(jiān)聽寫在組件標(biāo)簽上，樣式屬性綁定寫在template里,這里正常。

<customize-btn  @click.native="minus(rand2)"></customize-btn>
template: ` <div :class="btnClass">這是一個(gè)自定義的組件，讓它擁有點(diǎn)擊事件能力，就像個(gè)按鈕</div>  `,

從結(jié)論看，自定義組件的事件監(jiān)聽必須寫在組件標(biāo)簽上，而自定義組件的樣式屬性（包括其他屬性？）綁定必須在template里面？ 這個(gè)結(jié)論對(duì)不對(duì)呢？為什么呢？