<template>
    <div>
        <!-- 在这里编写你的模板代码 -->
        <h1>{{ message }}</h1>
        <button @click="changeMessage">Change Message</button>
    </div>
</template>
  
<script>
export default {
    data() {
        return {




            message: 'Hello, Vue!'
        };
    },
    methods: {

        changeMessage() {
            this.message = 'New Message!';
        }
    }
};
</script>
  
<style scoped>
/* 在这里编写你的样式代码，加上 scoped 属性表示样式仅在当前组件生效 */
div {
    text-align: center;
    margin: 20px;
}

h1 {
    color: #333;
}
</style>