SOURCE

new Vue({
    el:'#app',
    data:{
        name:"刘亦凝",
        age:20,
        image:"https://image.baidu.com/search/detail?ct=503316480&z=0&ipn=d&word=喜羊羊&step_word=&hs=0&pn=0&spn=0&di=169180&pi=0&rn=1&tn=baiduimagedetail&is=0%2C0&istype=2&ie=utf-8&oe=utf-8&in=&cl=2&lm=-1&st=-1&cs=301892282%2C4167107408&os=3595837423%2C1179697650&simid=3433300417%2C166492965&adpicid=0&lpn=0&ln=1776&fr=&fmq=1614655447725_R&fm=result&ic=&s=undefined&hd=&latest=&copyright=&se=&sme=&tab=0&width=&height=&face=undefined&ist=&jit=&cg=&bdtype=0&oriquery=&objurl=https%3A%2F%2Fgimg2.baidu.com%2Fimage_search%2Fsrc%3Dhttp%3A%2F%2Fwww.sinaimg.cn%2Fhs%2Fscan%2F2012-01-13%2FU4552P499T1D50006F11DT20120113162417.jpg%26refer%3Dhttp%3A%2F%2Fwww.sinaimg.cn%26app%3D2002%26size%3Df9999%2C10000%26q%3Da80%26n%3D0%26g%3D0n%26fmt%3Djpeg%3Fsec%3D1617247451%26t%3D8dad77946121c370cd8bb8a3b4e6fd31&fromurl=ippr_z2C%24qAzdH3FAzdH3Fooo_z%26e3Bx1hsit_z%26e3BpoAzdH3F14AzdH3Fxtywg2ywg2y7i7tpwtswg2-claAzdH3Fp7rtwgywg2v7gp7rtwg-8a0aca_z%26e3Bip4s&gsm=1&rpstart=0&rpnum=0&islist=&querylist=&force=undefined"
    },
    methods:{
        test:function(){
            this.title="21"*3;
            return this.title;
        },
        outputfunction:function(){

            return "姓名:" +this.name+"年龄"+this.age
        }
        ,
        random:function(){
            return Math.round(Math.random()*100);
        }
    
        
    }
})

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<div id="app">

<p>姓名：{{name}}</p>
 <p>年龄：{{age}}</p>
 <p>年龄*3：{{age*3}}</p>
 <p>函数输出名字和年龄：{{outputfunction()}}</p>
 <p>输出随机数：{{random()}}</p>
 <img v-blind:src="image" style="width:100px">
</div>