- vite中可以使用script setup語(yǔ)法糖蚜点，vscode有Volar擴(kuò)展來(lái)適配vue3的語(yǔ)法浅妆，需要禁用掉Vetur捆姜；
- vite使用script setup語(yǔ)法糖
1).屬性锌俱、方法無(wú)需返回
<template>
<div @click="changeNum">{{num}}</div>
</template>
<script lang="ts" setup>
import {ref} from 'vue';
let num = ref(10);
let changeNum = ():number=>num.value++
</script>
2). 組件引用，不需再次注冊(cè)永脓，直接引入后直接使用
<template>
<Child></Child>
</template>
<script setup>
import Child from '@/components/child';
</script>
3).父子組件傳值
// 父組件
<template>
<Child @child-click="handlerClick" />
</template>
<script setup>
import Child from './child.vue';
const handlerClick= (str) => {
console.log(str);
}
</script>
// 子組件
<template>
<button @click="handleClick">按鈕</button>
</template>
<script setup>
import { defineProps, defineEmit } from 'vue'
const emit = defineEmit(['child-click'])
const handleClick = () => {
emit('child-click', '子組件點(diǎn)擊事件')
}
</script>
