vue項目中遇到的一點小問題記錄

一、鼠標懸浮顯示不一樣的背景圖片，代碼以下：

效果如圖，頁面初始效果：

鼠標懸浮後效果：

二、for 循環發送axios遇到的問題

問題背景：

在聲動語商項目中，需求更改後，出現一個：教師發佈課程的時候要求一個課程同時發送給多個班級。
如今的接口：每次只能發送一個班級的id,也就是：classesId字段只能傳一個班級的id，所以爲了知足這個新需求就想着：將select修改成多選，使用for循環循環用戶選中的班級數組，使用axios發送建立課程請求。更改後的界面以下圖所示：

問題復現：
思路：使用for循環，發送axios,發現請求發送的data中classesId老是最後一個，立馬想到了閉包，覺得是閉包問題，因而使用

這種方法想着解決下閉包，從新發送axios請求發現classesId數據仍是不對。而後自我懷疑，覺得本身寫的閉包是否是有啥問題....

因而使用了第三方lodash的forEach方法一下，將axios請求寫到了foreach裏面，從新運行仍是發現不對。。。。

覺得this指向有問題，有將this從新賦值，結果：仍是同樣。。。。。。。

因而又調整了一下代碼：將axios請求從新封裝出去，從新在for循環裏面調用，結果：仍是不對

打斷點發現for循環出來的classesId數據是對的，可是加上axios請求，每次請求發送的classesId還只是最後一個的

又想着是否是axios的異步請求影響的，因而將axios改成了同步請求，結果：仍是同樣，這個時候，整我的就有點很差了。。。。

眼看着快要下班了，而這個問題已經看了一下午尚未解決，就很着急啊啊啊啊

努力回想本身曾經這樣請求過啊，當時並無發生任何不對。因而想着將請求的數據簡化一下，就將發送的data數據簡化到了只有classesId,想着只有一個數據了，就沒有再定義任何的變量，直接將數據寫到了axios請求內部。運行發現：classesId居然是對的。。。。因而立馬將其餘數據都寫到了axios請求內容，發現結果對了，天啊，終於看到了但願。。。。

問題緣由：

將這兩種數據的定義及發送方式對比，分析問題多是由於 js賦值的深拷貝和淺拷貝形成的。。。

其餘

解決過程當中還試了watch監聽for循環classesId的變化，發現也只能監聽獲取到最後一個classesId.，並不能解決這個問題