Vue 過渡組問題：過渡時 v-for object 的最后一項溢出容器
[英]Vue Transition Group issue: last item of v-for object overflows out of container when transitioning
從下面的代碼中可以看出，我正在嘗試對 object feedbacksToShow應用組轉換。 一切正常，除非我嘗試轉換列表的最后一項，它會溢出 #feedback-list div 容器。 我無法在包含的 div 上使用 overflow-hidden，因為我使用的工具提示會在懸停反饋項時從容器中 ...
為什么 VueJS 移動動畫只在一個方向上起作用？
[英]Why do VueJS move animations only work in one direction?
我完全被這個難住了。 出於某種原因，Vue3 將正確地為包含項目列表的<transition-group/>應用移動 animation class，但前提是列表向前推進。 我為此整理了一個 CodePen，即使有一個非常簡單的用例（列表數字），如果您向除向后以外的任何方向前進，轉換類 ...
如何實施<transition-group>在 v-for 循環內？</transition-group>
[英]How to implement <transition-group> inside a v-for loop?
對此有一個建議的答案，但該解決方案對我不起作用。 我有一個嵌套的v-for並希望在最里面的 li 元素被我的計算語句刪除或添加時為其設置動畫。 我當前的代碼如下所示： <transition-group @before-enter="beforeEnter" @enter="enter ...
VueJS 過渡組不適用於圖像，我該如何淡化圖像？
[英]VueJS transition-group is not working on images, how can I fade images?
我正在嘗試創建一個圖像 slider，它會使圖像變淡。 圖像 1 應該在圖像 2 淡入的同時淡出。換句話說：它們之間不應該有間隙。 現在它沒有什么比褪色更重要的了。 該代碼正在運行，到目前為止，當用戶單擊“下一步”時，當前圖像消失，0.9 秒后出現下一個圖像。 它們之間有 0.9 秒的延遲（與 C ...
Vue.js<transition-group> 僅在最后一個元素上應用 animation</transition-group>
[英]Vue.js <transition-group> only applying animation on last element
我正在練習 Vue轉換組並專門在此特定部分中模仿 Vue 文檔示例。 問題是我的示例將僅在末端元素上應用 animation 而不是正在添加/刪除的元素。 有人可以解釋我做錯了什么嗎？ ：（ 謝謝。 這是應用程序的鏈接以獲取更多說明 ...
顯示和隱藏元素列表時，在頁面的其余部分平滑 Nuxt/Vue 過渡
[英]smooth Nuxt/Vue transition on the rest of the page when displaying and hidding a list of elements
我得到了一個網格項目列表，以及一個在“多看”和“少看”之間切換的按鈕。 單擊“查看更多”按鈕，將顯示所有列表。 點擊少看，只顯示3個項目。 當顯示所有項目時，我們得到了一個很好的過渡，但是當我們隱藏它們時，底部的所有元素都不會跟隨運動。 我怎樣才能使過渡順利，不要讓用戶在段落中間？ 模板示例： ...
在VueJS中向列表添加多個元素時添加過渡animation
[英]Adding transition animation when adding multiple elements to the list in VueJS
所以，看看這個小提琴。 在將新的多個元素添加到呈現的列表時，我想從 vue 功能添加過渡 animation。 我已經嘗試使用屬性tag="div"添加transition-group 。 但是，仍然添加了沒有 animation 的元素。 有什么建議嗎？ ...
如何預加載圖像以在過渡組中使用
[英]How can I preload images for use in a transition-group
我有一個包含兩個或更多圖像的transition-group 。 這是有效的，但現在我想預加載下一張圖片。 這就是我現在所擁有的： 每次我更新currentIndex時，都會計算currentImg ，這樣就可以了。 現在我需要預加載currentIndex + 1圖像。 這可能嗎？ ...
使用過渡動畫從待辦事項列表中添加/刪除項目
[英]Animate adding/deleting items from todo list using transition
我有一個基於 vuejs 官方文檔中提供的示例的待辦事項列表。 示例： https ://jsfiddle.net/87Lfbzng/ 這樣做的問題是項目被立即刪除/添加，沒有動畫。 如果我按照官方文檔實現transition標簽就會生效。 VueJS 轉換 我嘗試將轉換標簽放在ul中，但這 ...
使用篩選數組時的轉換組意外行為
[英]Transition-group unexpected behavior when using a filtered array
我對transition-group有一個問題。 問題是我正在嘗試渲染按某種條件過濾的列表。 在我的例子中 - 取決於最小/最大界限。 怎么修好？ 最初，我嘗試使用在transition-group內呈現的Array的計算值。 但顯然，每次更新范圍滑塊值時它都會返回新數組。 ...
Vue.js：過渡組動畫不起作用
[英]Vue.js: transition-group animation doesn't work
我有一個滑塊作為過渡組組件編寫： 在我的<style>我有這個： 我的方法中有兩個函數可以讓我的幻燈片移動： 我所有的幻燈片目前都只是組件data()一個硬編碼數組，其中包含三個包含圖像和一些狀態的對象。 現在我無法為幻燈片設置動畫，也不能在單擊調用這些功能的按鈕后，而不是設 ...
您可以在 vue.js 中更改項目的 ID 嗎？
[英]Can you change an item's ID in vue.js?
我有一個項目列表，包含在一個 javascript 數組中。 類似於vue.js 文檔中的示例。 這是我正在努力解決的工作流程： 用戶點擊“添加”。 我立即將一個項目添加到列表中（在他們要求的位置） 我向服務器發送 ajax 請求以創建項目。 調用返回新項目的數據庫行。 我正 ...