vue3.0新功能

一、创建方式改变

import { createApp } from 'vue'
import App from './App.vue'

createApp(App).mount('#app')

二、组件中的模板结构可以没有根标签

<template>
    <p>{{ name }}</p>
    <p>{{ age }}</p>
    <p>{{ sex }}</p>
    <button @click="sayHello()">欢迎</button>
</template>

三、数据响应式

       1.基本数据类型使用ref的get set ，对象数据类型使用ref的proxy

setup () {
    // data 响应式数据 
    let name = ref("intic");
    let age = ref(25);
    let job = ref({
        type: "前端工程师",
        salary: '30K'
    })
    function changeInfo () {
        name.value = "inticaler";
        age.value = 18;
        console.log(job.value);
        job.value.type = "UI设计师";
        console.log(name,age)
    };
    return {
        name,
        age,
        job,
        changeInfo
    }
}