随机数不打印结果

Question

我试图在点击按钮时获得一个随机数，但我做错了一些事情，它与另一个没有功能的示例一起工作，所以我一定做错了什么，但找不到什么。现在它将函数代码打印为文本。

这是 HTML：

<div id="aleatori">

   <button v-on:click="randomNumber">Aleatori</button>

   <p>{{ randomNumber }}</p>

</div>

这是js

var aleatori = new Vue({

    el:'#aleatori',

    data: {

        randomNumber: function () {

            this.random = Math.floor(Math.random() * (10 - 1 + 1)) + 1

          }

    }

})

Answer 1

您应该调用一个方法onclick并random进行data如下更改：var aleatori = new Vue({&nbsp; &nbsp; el:'#aleatori',&nbsp; &nbsp; data() {&nbsp; &nbsp; &nbsp; &nbsp; return{&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; random:0&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; },&nbsp; &nbsp; methods:{&nbsp; &nbsp; &nbsp; randomNumber() {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; this.random = Math.floor(Math.random() * (10 - 1 + 1)) + 1&nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; }})<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script><div id="aleatori">&nbsp; &nbsp; &nbsp;<button v-on:click="randomNumber">Aleatori</button>&nbsp; &nbsp; &nbsp;<p>{{ random }}</p></div>