个人笔记-vue3与vue2的写法区别

vue2转vue3的个人总结

• • nextTick
  • ref
  • • 值
    • refs的引用

nextTick

vue2写法

import vue from 'vue';

vue.nextTick(() => {
});

vue3写法

import { nextTick } from 'vue';

nextTick(() => {
});

ref

值

vue2

data() {
	return {
		msg: 'huhu',
	};
},

vue3

<div>msg</div>
import { ref } from 'vue';
setup() {
	const msg = ref('helloe');
	return {
		msg,
	}
}

// 写法2
import { reactive, toRefs } from 'vue';
setup() {
	const ms = reactive({
		name: 'huh',
		age: '22',
		sex: 'ds',
	 	msg = 'helloe'
	});
	return {
		...toRefs (ms),
	}
}

refs的引用

vue2

<div ref="refDom"></div>
this.$refs.refDom;

vue3

<div ref="refDom"></div>
import { ref } from 'vue;
setup() {
	const refDom = ref(null);
	return {
		refDom,
	};
}