Vue Composition API是Vue.js 3.0引入的新功能。它允許您使用函數來編寫可重用的邏輯，而不僅僅是依賴于Vue.js組件的配置選項。Composition API也提供了更好的邏輯結構，使得組件更加可讀和易于維護。

// 示例：使用Vue Composition API編寫一個計數器
import { ref } from 'vue';
export default {
setup() {
const count = ref(0);
const incrementCount = () =>{
count.value++;
};
return {
count,
incrementCount
};
}
}

在上面的示例中，我們使用了Vue Composition API中的ref來創建可觀察的狀態。然后我們定義了一個函數incrementCount來增加計數器的值。最后，在setup函數中，我們返回了count和incrementCount，以便它們可以在模板中使用。

使用Vue Composition API的好處是您可以分離組件的邏輯，使其更加可重用和易于測試。此外，Composition API還提供了響應式轉換和計算的工具，使得數據的操作和組合更加簡單清晰。

// 示例：使用Vue Composition API計算商品的總價
import { ref, computed } from 'vue';
export default {
props: {
price: Number,
qty: Number
},
setup(props) {
const totalPrice = computed(() =>{
return props.price * props.qty;
});
return {
totalPrice
};
}
}

在上面的示例中，我們使用Composition API的computed函數來計算商品的總價。其中props.price和props.qty是通過組件屬性傳遞的，而totalPrice是根據這兩個值計算出來的。這樣，我們就可以使用totalPrice來代替模板中繁瑣的計算操作。

總之，Vue Composition API是Vue.js 3.0中非常重要的一個新功能，可以幫助您更好地組織和重用代碼，使得組件更加可讀、易于維護，并且提供了更加簡單的數據操作和組合方法。