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

1、鼠標懸浮顯示不同的背景圖片，代碼如下：

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

鼠標懸浮后效果：

2、for 循環(huán)發(fā)送axios遇到的問題 問題背景：

在聲動語商項目中，需求更改后，出現(xiàn)一個：教師發(fā)布課程的時候要求一個課程同時發(fā)送給多個班級。

現(xiàn)在的接口：每次只能發(fā)送一個班級的id,也就是：classesId字段只能傳一個班級的id，因此為了滿足這個新需求就想著：將select修改為多選，使用for循環(huán)循環(huán)用戶選中的班級數(shù)組，使用axios發(fā)送創(chuàng)建課程請求。更改后的界面如下圖所示：

問題復現(xiàn)：

思路：使用for循環(huán)，發(fā)送axios,發(fā)現(xiàn)請求發(fā)送的data中classesId總是最后一個，立馬想到了閉包，以為是閉包問題，于是使用

這種方法想著解決下閉包，重新發(fā)送axios請求發(fā)現(xiàn)classesId數(shù)據(jù)還是不對。然后自我懷疑，以為自己寫的閉包是不是有啥問題....

于是使用了第三方lodash的forEach方法一下，將axios請求寫到了foreach里面，重新運行還是發(fā)現(xiàn)不對。。。。

以為this指向有問題，有將this重新賦值，結果：還是一樣。。。。。。。

于是又調整了一下代碼：將axios請求重新封裝出去，重新在for循環(huán)里面調用，結果：還是不對

打斷點發(fā)現(xiàn)for循環(huán)出來的classesId數(shù)據(jù)是對的，但是加上axios請求，每次請求發(fā)送的classesId還只是最后一個的

又想著是不是axios的異步請求影響的，于是將axios改為了同步請求，結果：還是一樣，這個時候，整個人就有點不好了。。。。

眼看著快要下班了，而這個問題已經看了一下午還沒有解決，就很著急啊啊啊啊

努力回想自己曾經這樣請求過啊，當時并沒有發(fā)生任何不對。于是想著將請求的數(shù)據(jù)簡化一下，就將發(fā)送的data數(shù)據(jù)簡化到了只有classesId,想著只有一個數(shù)據(jù)了，就沒有再定義任何的變量，直接將數(shù)據(jù)寫到了axios請求內部。運行發(fā)現(xiàn)：classesId竟然是對的。。。。于是立馬將其他數(shù)據(jù)都寫到了axios請求內容，發(fā)現(xiàn)結果對了，天啊，終于看到了希望。。。。

問題原因：

將這兩種數(shù)據(jù)的定義及發(fā)送方式對比，分析問題可能是因為 js賦值的深拷貝和淺拷貝造成的。。。

其他

解決過程中還試了watch監(jiān)聽for循環(huán)classesId的變化，發(fā)現(xiàn)也只能監(jiān)聽獲取到最后一個classesId.，并不能解決這個問題