引用了slick輪播圖插件块茁,使用for循環(huán)為其賦值
從后臺獲取數(shù)據(jù)之后齿坷,調(diào)取插件初始化
一開始以為是ajax獲取異步的問題造成的,但是不管設(shè)置ajax為同步異步都不能渲染頁面数焊。
如果沒有使用for循環(huán),則可以成功渲染崎场,一旦使用for循環(huán)佩耳,就不能起到作用,遂仔細檢查結(jié)構(gòu)標簽谭跨,發(fā)現(xiàn)插件動態(tài)添加的class為slick-list draggable的標簽本應(yīng)包裹.item標簽干厚,但此時兩個標簽卻是同級關(guān)系。
問題出在vue渲染頁面螃宙,并不是立時就更改了dom結(jié)構(gòu)蛮瞄,導(dǎo)致插件渲染的標簽并非for循環(huán)出來的標簽,因此插件沒有起到作用谆扎。
解決方法挂捅,在ajax回調(diào)中,調(diào)用插件初始化函數(shù)外加上$nextTick()堂湖;確保vue已更改dom結(jié)構(gòu)完畢之后闲先,再調(diào)用插件初始化。