Vue.js 变量设置教程：使用 data 属性定义和修改变量

<template>
  <div>
    <p>{{ message }}</p>
    <button @click="changeMessage">Change Message</button>
  </div>
</template>
<script>
export default {
  data() {
    return {
      message: 'Hello Vue!',
    };
  },
  methods: {
    changeMessage() {
      this.message = 'New Message';
    },
  },
};
</script>
<p>在上面的例子中，我们在 data 中定义了一个名为 message 的变量，并在模板中使用 {{ message }} 来显示变量的值。在 methods 中，我们定义了一个 changeMessage 方法，当点击按钮时，会将 message 的值改为 'New Message'。</p>