vue3.0

vue3.0

npm init vite-app vue3-app-vite : 下载vite-app手脚架并用手脚架搭建vue3-app-vite

npm i 安装依懒

npm run dev 启动工程

main.js与vue2的区别

vue2
    new Vue({
      router,
      store,
      render: (h) => h(App),
    }).$mount("#app");

vue3
createApp(App).mount("#app");

vue3没有Vue的构造函数

this指向一个代理

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ThV7QsXa-1661087539487)(E:\Duyidu\要背的知识\01\assets\04.png)]

setup(){}:

1、所有生命周期钩子函数之前调用

2、setup中，count是一对象

3、实例代理中，count是一个count.value

4、通过ref得到响应数据

<template>
	<p>
    	<button @click="count++">count:{{count}}</button>
    </p>    
</template>

<script>
    import {ref} from "vue";
	export default{
        setup(){
            let count = ref(0)
        }
    }
</script>