vue实例，什么是vue实例，哪些属于vue实例

什么是Vue实例

在Vue中，每个Vue应用都是通过创建一个Vue实例来实现的。Vue实例是Vue框架的基本构建块，它是由Vue构造函数创建的一个对象。通过实例化Vue构造函数，我们可以得到一个Vue实例，从而可以在页面中管理数据和操作DOM

怎么创建一个vue实例

实例化 Vue 时，需要传入一个选项对象，它可以包含数据（data），模板（template），挂载元素（el），方法（methods）与生命周期钩子函数（created，mounted...）等选项。下面是一个真实项目中定义的Vue实例：

import Vue from 'vue';
import App from './App.vue'
...
// 激活Vue调试工具vue-devtools
Vue.config.devtools = true;

new Vue({
    router, // react-router
    store,  // vuex
    el: '#app', // 需要渲染的DOM节点
    render: h => h(App) // //h是createElement 的别名，创建/加载组件
});

vue实例的创建，需要import引入，vue.use("")的使用，new vue（{}）的使用，使用的时候需要用到 el：‘#xxx’绑定作用的区域，el的绑定方法和}).$mount（“”）的方法其实功能没什么区别，用什么方法都可以，需要data：{}用来填写所需的数据，需要computed根据已有的数据去获得新的数据，需要methods添加函数方法，做一些功能的实现。一个vue实例的基本属性就是这些。

（1）挂载
el:称之为挂载点。原理来自于：MVC架构中，使用一个标签当做容器包住一些标签，使得标签被重新渲染，同时保留一些必要的属性。

l两种绑定的方法：

1.el:"id选择器"。

2.绑定原型上的$mount 即vm.$mount("id选择器");

（2）data

.data:存储vue实例或组件里面的数值。在vue的实例中它是以一个对象的方式（多个键值对），在组件中它是一个函数，通过函数返回一个对象。

data是函数形式,是对象形式，不能使用箭头函数

(3)computed

computed用来监控自己定义的变量，该变量不在data里面声明，直接在computed里面定义.
然后就可以在页面上进行双向数据绑定展示出结果或者用作其他处理；
computed比较适合对多个变量或者对象进行处理后返回一个结果值，也就是数多个变量中的某一个值发生了变化则我们监控的这个值也就会发生变化，
举例：总金额=价格*数量

<div id="example">
  <p>Original message: "{{ message }}"</p>
  <p>Computed reversed message: "{{ reversedMessage }}"</p>
</div>
 
var vm = new Vue({
  el: '#example',
  data: {
    message: 'Hello'
  },
  computed: {
    // 计算属性的 getter
    reversedMessage: function () {
      // `this` 指向 vm 实例
      return this.message.split('').reverse().join('')
    }
  }
})
 

（4）methods

methods是一个对象，用于存放Vue实例的方法。这些方法可以在Vue实例的模板中被直接调用，并且可以接收参数。使用methods的目的是为了将某些业务逻辑封装起来，使得代码更加清晰和可维护。以下是一些关于如何在Vue中使用methods的基本指南：

1. ‌定义方法‌：在Vue实例的methods对象中定义方法。这些方法可以是简单的函数，也可以是比较复杂的逻辑处理。例如： 

methods: {
  greet(time) {
    return `Good ${time}!`;
  },
  haveLunch() {
    return `吃过午饭了吗?`;
  }
}

以上就是vue实例的基本属性。