在Vue中，一般會使用query來進行路由跳轉攜帶參數，而有時候我們會需傳遞數組類型的參數，本文將詳細介紹如何在Vue中使用query傳遞數組類型的參數。
首先，在路由跳轉時，我們需要將數組處理成字符串形式并攜帶在query中，如下所示：
```htmlTo Example ```
在代碼中，我們將需要傳遞的數組`[1, 2, 3]`使用`JSON.stringify()`方法轉換為了字符串形式，并將其作為query中的參數`arr`的值，傳遞給了目標頁示例頁。
接下來，在目標頁獲取傳遞的數組參數，并使用`JSON.parse()`方法將其還原為數組形式：
```js
export default {
created() {
console.log(JSON.parse(this.$route.query.arr))
}
}
```
在示例頁的created()生命周期函數中，我們使用`this.$route.query.arr`獲取到了傳遞的字符串形式的數組參數，并使用`JSON.parse()`方法將其還原成了之前傳遞的`[1, 2, 3]`數組形式，并輸出到控制臺中。
此時，如果我們在示例頁中點擊了“to example”按鈕進行路由跳轉，控制臺將會輸出：
```
[1, 2, 3]
```
我們成功的在Vue中使用query傳遞了數組類型的參數，并在示例頁中成功獲取到了這個傳遞的數組。
需要注意的是，在使用`JSON.stringify()`方法將數組參數轉換為字符串時，如果數組中含有`null`, `undefined`這兩種類型，將會被轉換為字符串"null"和"undefined"。因此，在使用query傳遞數組參數時，應避免傳遞這兩種類型的參數。當然，如果要自己實現convertor可以繞過這個限制。
同時，需要注意的是，在使用query傳遞參數時，應該盡量避免傳遞過長的、復雜的參數，以免影響程序的性能和安全性。傳遞數據量過大，可能會增加程序運行的消耗以及數據泄露的風險。
總的來說，Vue中使用query傳遞數組類型的參數需要將數組先使用`JSON.stringify()`方法轉換為字符串形式，并將其作為query中的參數傳遞給目標頁，在目標頁中使用`JSON.parse()`方法將其還原為數組形式，這樣我們就可以順利的在Vue中使用query傳遞數組類型的參數了。
上一篇vue 模擬數據步驟