<template>
  <div>
    <div class="geyao">{{ geyao }}</div>
    <button @click="changeName">修改</button>
  </div>
</template>
<script>
//data 必须是函数
export default {
  name: "geyao",
  data() {
    return {
      geyao: "我是歌谣",
    };
  },
  methods: {
    changeName() {
      this.geyao = "fangfang";
    },
  },
};
</script>
<style>
.geyao {
  color: aquamarine;
}
</style>

运行结果