关于vue3整理

安抚之啊前vue2获取dom比较直接

1、vue3使用this

vue3提供了getCurrentInstance ，通过这个属性，找到全局属性globalProperties

import { getCurrentInstance } from 'vue'
const instance = getCurrentInstance()
const parent = instance.appContext.config.globalProperties

2、将一个由reactive生成的响应式对象转为普通对象。

用于读取响应式对象对应的普通对象，对这个普通对象的所有操作，不会引起页面更新。

import { toRaw } from '@vue/reactivity'
// e
let list = toRaw(e);

3、Vue 3.0获取单个DOM

<template>
  <div ref="myRef">获取单个DOM元素</div>
</template>

<script>
import { ref, onMounted } from 'vue';

export default {
  setup() {
    const myRef = ref(null);

    onMounted(() => {
      console.dir(myRef.value);
    });
    return {
      myRef
    };
  }
};
</script>

vue2获取dom

<div ref="myRef"></div>
this.$refs.myRef