vue 对象

作者：末世修罗发布日期:2026-05-22 浏览:97

// Vue 对象示例代码

// 引入 Vue 库
import Vue from 'vue';

// 创建一个 Vue 实例
new Vue({
  // 挂载的 DOM 元素
  el: '#app',

  // 数据属性
  data: {
    message: 'Hello Vue!'
  },

  // 方法集合
  methods: {
    greet: function() {
      alert(this.message);
    }
  },

  // 计算属性
  computed: {
    reversedMessage: function() {
      return this.message.split('').reverse().join('');
    }
  },

  // 生命周期钩子
  mounted: function() {
    console.log('Vue 实例已经挂载');
  }
});

/* 
解释说明：
1. `el`：指定 Vue 实例挂载的 DOM 元素。
2. `data`：定义 Vue 实例的数据属性，这些数据是响应式的。
3. `methods`：定义可以在 Vue 实例中调用的方法。
4. `computed`：定义计算属性，用于根据其他属性派生出新值。
5. `mounted`：生命周期钩子，在实例挂载完成后调用，可以用来执行一些初始化操作。
*/

上一篇：vue3 resolvecomponent

下一篇：props vue