在Vue開發中，我們經常需要定義可變的變量和不可變的常量。ES6引入的const關鍵字就是用來定義不可變常量的。

const num = 10;
num = 20; // 報錯，無法重新賦值

使用const定義的常量無法重新賦值，這也是const最大的特點和作用之一。

在Vue中，const變量也非常常見，它們可以用來定義一些不會被修改的值，比如：

const API_BASE_URL = "https://www.example.com/api";
const MAX_LIMIT = 10;

這里定義了兩個常量，一個用來表示API的根路徑，一個用來表示最大限制數量。

在Vue組件中，我們也可以使用const定義一些常量，比如：

const REQUEST_STATUS = {
PENDING: "pending",
SUCCESS: "success",
FAILED: "failed"
}

這里定義了一個包含三種狀態的常量，用來表示請求的各種狀態。

在Vue中，const變量的作用和用法和JavaScript中一致，只是在Vue中更加靈活地應用。

在Vue的組件中，我們經常需要使用一些常量來表示一些固定的值，比如：

<template>
<div :class="status === REQUEST_STATUS.SUCCESS ? 'success' : 'warning'">
<p>{{ message }}</p>
</div>
</template>
<script>
const REQUEST_STATUS = {
PENDING: "pending",
SUCCESS: "success",
FAILED: "failed"
};
export default {
data() {
return {
status: REQUEST_STATUS.PENDING,
message: ''
};
},
methods: {
fetchData() {
axios.get('/api/data')
.then((response) =>{
this.status = REQUEST_STATUS.SUCCESS;
this.message = response.data.message;
})
.catch(() =>{
this.status = REQUEST_STATUS.FAILED;
this.message = 'Failed to fetch data';
});
}
}
}
</script>

這里我們使用了一個常量REQUEST_STATUS，用來表示請求的各種狀態，然后在模板里根據相應的狀態設置類名，從而改變樣式。

在data函數里，定義了一個狀態變量status和一個消息變量message，初始值分別為pending和空字符串。然后，在fetchData函數里使用axios發起了一個請求，根據請求結果設置狀態和消息。

通過使用const定義常量和Vue的數據綁定，我們可以更加簡單、方便地管理和使用常量，提高開發效率。