示例vue

<script lang="ts">
export default{
  name:'mylist',
  data(){
    return{
      name:'张三',
      age:18,
      tel:'666666'
    }
  },
  methods:{
    showtel(){
      alert(this.tel)
    },
    changeAge(){
      this.age += 1
    }
  }
}
</script>

<template>
  <div class="mylist">
   <h2>姓名：{{name}}</h2>
   <h2>年龄：{{age}}</h2>
   <h2>电话：{{tel}}</h2>
   <button @click="changeAge">修改年龄</button>
   <button @click="showtel">查看联系方式</button>
 </div>
</template>

<style scoped>
.mylist{
  background-color:#12e;
  box-shadow: 0 0 10px;
  border-radius: 10px;
  padding: 10px;
}
</style>