VueJS 從 2X 遷移到 3X 不工作

[英]VueJS Migration from 2X to 3X Not Working

我正在嘗試將遺留應用程序從 Vue 2 轉換為 Vue 3。我對 Vue 不是很熟悉，我正在嘗試遵循他們在其文檔網站上提供的新遷移模板，但我遇到了問題。 我沒有收到任何 JS 控制台錯誤，但我的 Vue 代碼不再呈現。 現有代碼<script> var vm = new Vue( ...

Vue JS 過渡使用 in v for

[英]Vue JS transition using in v for

我是 vuejs 的新手，我有問題。 看我的代碼模板： 腳本： 風格： 現在我的問題是當鼠標進入 li 時，所有 li 轉換工作並顯示信息 class。 我知道它是因為isHover變量。 但我不知道如何在使用$(this).find(CHILD)時像 JQuery 一樣處理這個問題。 我搜索了很 ...

為什么 VueJS 移動動畫只在一個方向上起作用？

[英]Why do VueJS move animations only work in one direction?

我完全被這個難住了。 出於某種原因，Vue3 將正確地為包含項目列表的<transition-group/>應用移動 animation class，但前提是列表向前推進。 我為此整理了一個 CodePen，即使有一個非常簡單的用例（列表數字），如果您向除向后以外的任何方向前進，轉換類 ...

props 在 VUE DEV TOOLS 中一直顯示為 $attrs

[英]props keep showing as $attrs in VUE DEV TOOLS

在此處輸入圖片描述 在此處輸入圖片描述我的道具在 VUE DEV TOOLS 中一直顯示為 $attrs 我曾嘗試使用 inheritAttrs: false 和 v-bind="$attrs",does not work 禁用 attrs ...

如何在 vuejs 中使用 javascript 在轉換中使用三元運算符？

[英]How to use ternary operator in transition using javascript in vuejs?

我正在嘗試使用 vuejs 和 gsap 在 h2 之間實現非常基本的幻燈片。 根據方向（下一張和上一張幻燈片），我需要 2 種不同類型的轉換。 為了獲得緊湊的代碼，我使用了三元運算符?: 如果我使用 2 div 和 v-if / v-else 語法，它工作得很好。 我在這里做錯了什么？ 我需要以 ...

Vuejs - 轉換組輪播 animation 一次一項

[英]Vuejs - transition-group carousel animation one item at a time

我正在嘗試使用 Vue 過渡組來實現這種輪播/幻燈片效果： 正如您所看到的，他們在上一步上升時為一個列表項（步驟）設置動畫，而當前一個在時間軸之后上升，其內容也隨之上升。 我不確定使用transition-group是否可以實現我想要完成的任務，因為整個父塊都會設置動畫，而不是子節點。 如果是這樣 ...

選項卡上的滑動過渡（一個推動另一個）

[英]Slide transition on tab (one pushing the other)

我正在嘗試實現兩個選項卡之間的幻燈片過渡。 一個選項卡應該來自左側，將另一個推向右側，而另一個則相反。 離開過渡進行得很順利，但選項卡直接彈出而沒有從它應該開始的地方開始......我制作了一個 CodePen 來重現我嘗試過的內容： CodePen 上的幻燈片過渡測試這是 HTML，它只是一個包 ...

如何將 CodePen 拆分為 webpacked 組件？

[英]How to split CodePen into webpacked Components?

我正在關注此CodePen ，並嘗試將其放入默認的 VueJS 2.0 Boilerplate 中。 這就是我將文件拆分的方式： 我在讓它運行時遇到了很大的問題。 例如我的 App.vue 沒有找到state 。 這就是我在main.js中定義它的方式： import Vue from 'vue ...

Vue.js過渡存在不適用於子元素

[英]Vuejs transition being does not work with child elemenets

我有以下項目： https : //codesandbox.io/s/vue-template-c1rj1 我希望圖像只是從屏幕底部已經出現在頁面中間，但是它首先是從底部出現，然后移動到頁面中心。 我注意到將通知框類的寬度設置為100％可以解決此問題，但是我不確定為什么。 ...

使用過渡動畫從待辦事項列表中添加/刪除項目

[英]Animate adding/deleting items from todo list using transition

我有一個基於 vuejs 官方文檔中提供的示例的待辦事項列表。 示例： https ://jsfiddle.net/87Lfbzng/ 這樣做的問題是項目被立即刪除/添加，沒有動畫。 如果我按照官方文檔實現transition標簽就會生效。 VueJS 轉換 我嘗試將轉換標簽放在ul中，但這 ...

VueJS過渡滑塊

[英]VueJS transition slider

我有一個包含三個步驟的表格。 並且，每按一下獵物，下一步就要從一側移到另一側。 問題在於，方向改變后，轉換沒有正確應用。 有誰知道為什么vue在方向改變后沒有向顯示的元素添加正確的類？ 關於為什么找不到解決方案，我一直ing不休。 這是一支筆： https://codepen. ...

如何使用 Vuejs 和 twitter 引導程序創建模態對話框

[英]How to create modal dialog using Vuejs and twitter bootstrap

我想在Vuejs中創建輸入表單對話框。 有什么方法可以使用twitter bootstrap創建引導模式對話框？ 我找到了一種方法（見下文）來實現它，但需要自定義 CSS 並且我無法選擇引導 CSS。 例子 我不能使用Vuetify或 vue-bootstrap JS。 ...

為同一組件提供不同的過渡名稱

[英]vue different transition names for the same component

是否可以為1個元素應用2個過渡名稱？ 我有3個li元素，我希望所有這些元素都有相同的休假，但只有前一個具有一定的入口。 例如，我希望他們所有人都擁有mizi-leave，但只有前一個擁有pizi-enter。 我被這個問題困擾，找不到任何示例。 如果不可能的話，還有其他方法可以實現我想要 ...

列出vuejs中的轉換，更改基礎數組

[英]List transitions in vuejs, changing the underlying array

我需要能夠對垂直列表中的拖放進行動畫處理。 我使用了vuedraggable ，將我的列表包裝在一個transition-group ，一切vuedraggable 。 直到我從服務器獲取新數據。 現在，由於瞬間引入了transition-group ，因此舊數據和新數據一起在DOM中一起 ...

如何在另一個轉換“內部”使用Vue JS轉換？

[英]How to use Vue JS transition “inside” another transition?

假設我有一個正常的過渡，效果很好（在vue文檔之后）。 但是我想在那之外進行另一種過渡。 例如，某個元素滑入 ，但其中的文本同時消失了嗎？ 我無法獲得內部子過渡來進行動畫處理。 它沒有被解雇嗎？ 我也嘗試過“出現”，並且認為該節點是新的。 幾乎沒有關於此的信息。 ...

路徑到正則表達式查找與路由匹配的正則表達式

[英]path-to-regexp Find regular expression matching the route

我在頁面加載時添加了動態子組件。 在刷新頁面時，在父級的OnCreated中添加子級路由不會使頁面正常工作。 因此，我正在解析頁面模板（當頁面加載時，我知道它們）。 我現在正在尋找一種方法來知道與href匹配的路由。 Vue-js使用路徑到正則表達式，我的問題很簡單。 我想 ...

Vuejs 列表重新排序不會觸發轉換

[英]Vuejs list reorder doesn't trigger transitions

我已經做了一些 vuejs 快一年了，但我從來沒有真正讓動畫和過渡工作，我似乎很不清楚這一切應該如何工作，今天我決定嘗試並最終理解它們，但我又一次卡住了，過渡根本行不通，我不明白我做錯了什么。 這是我的代碼： 的HTML JS CSS https://jsfiddle.net/e ...

Vue.js過渡無法與計算屬性一起使用

[英]Vuejs Transition not functioning with computed property

我正在創建一個簡單的庫存系統，該系統將具有各種類別的物料以及顯示所有物料的選項。 從“所有”類別轉到“常規”類別將刪除不必要的項目，但會在相當長的一段時間內留出空隙，並且在空隙滑入到位后沒有任何動畫效果。 我正在使用Vuejs和vue2-animate進行此操作。 https ...

帶有CSS過渡的VueJS中的簡單漸變入口

[英]Simple fade entrance in VueJS with CSS transition

它看起來很簡單，但是我可以使它工作。 當將一個新元素添加到我的列表中時，我希望其他元素移動以讓新元素留出空間，然后新元素必須以淡入淡出的方式出現。 我無法制作這個簡單的動畫。 我可以移動其他元素，但是新元素沒有任何淡入淡出過渡。 它只是出現！ BIM。 這是一個Codepen ...

將vuejs過渡組應用於Bootstrap網格

[英]Apply vuejs transition-group to Bootstrap grid

我試圖將vuejs轉換應用於Bootstrap網格，但它完全搞砸了網格系統，因為轉換組修改了DOM並row和col-md-6標記之間添加了一個新標記。 例： 渲染時，它被修改為： 新的span標簽與網格系統.row ，因為.col-md-6不再是.row的直接子.row 。 ...