vue3中使用flip動(dòng)畫(huà)技術(shù)實(shí)現(xiàn)圖片預(yù)覽案例，主要依托vue3的ref獲取元素的dom結(jié)構(gòu)來(lái)實(shí)現(xiàn)的，開(kāi)源庫(kù)暫時(shí)沒(méi)有找到合適vue3環(huán)境的flip動(dòng)畫(huà)技術(shù)棧依賴工具。所以只好動(dòng)手操作元素的dom結(jié)構(gòu)來(lái)實(shí)現(xiàn)基于flip動(dòng)畫(huà)技術(shù)棧的圖片預(yù)覽器功能。寫(xiě)法完全吻合vue3的setup語(yǔ)法糖規(guī)范，和原生html相比還是少了些代碼的，實(shí)現(xiàn)的思路是如出一轍。

只要掌握了flip動(dòng)畫(huà)技術(shù)棧的核心概念，那個(gè)環(huán)境下都可以自由實(shí)現(xiàn)flip動(dòng)畫(huà)的，包括圖片預(yù)覽，元素移動(dòng)，隨機(jī)分布元素，多圖片預(yù)覽功能，刪除元素動(dòng)畫(huà)和新增動(dòng)畫(huà)等等。