堆棧內存溢出
cost 203 ms
觀察可見性的高階組件：React？

[英]Higher Order Component to observe Visibility: React?

我創建了一個高階組件，如下所示： 並像這樣使用它： 但是，這會將每個組件包裝到我不想要的部分中。 我嘗試使用React.Fragment但這不允許您傳遞 ref 來跟蹤組件。 有沒有更好的方法來重新創建此 HOC，以便在不將其包裝在額外的 div 或部分中的情況下合並可見性跟蹤？ ...

嘗試在 react-grid-layout 中實現 react-intersection-observer 但沒有成功

[英]Trying to implement react-intersection-observer inside react-grid-layout with no luck

賞金將在 4 天后到期。 此問題的答案有資格獲得+50聲望賞金。 www.amitpatil.me正在尋找規范的答案： 我正在尋找為什么它不起作用的解決方案......我已經創建了演示，我希望你修復演示。 所以我可以在我的代碼中實現這個解決方案。 我有一個頁面，其中大約有 10-15 張卡片從 ...

[React][useInfiniteQuery] 如何限制第一次獲取調用僅在視圖在視口中可見時發生

[英][React][useInfiniteQuery] How to restrict the first fetch call to happen only when the view is visible in the viewport

我在我的組件中使用 useInfiniteQuery 掛鈎無限滾動項目。 我希望第一次提取僅在視圖在視口中可見時發生。 我正在使用 useInView/intersection observer 來查找視圖在視口中是否可見。 我正在使用 useInView/intersection observer ...

React Three Fiber, Drei & Intersection Observer：如何基於 InView 組件更改 Canvas Model 元素

[英]React Three Fiber, Drei & Intersection Observer: How to change Canvas Model Element Based on The InView Component

將不勝感激你能提供幫助:)即使是朝着正確的方向輕推也是受歡迎的問題如何根據 Aside 組件在滾動條上顯示不同的盆景部分。 上下文： BonsaiPart 基於名為partName的道具更改網格。 我想為每個 Aside 組件顯示一個不同的盆景部件，因此基本上完全改變了 Canvas。 我想有多種方 ...

IntersectionObserver - 變換屬性針對整個 SVG animation 而不是 class

[英]IntersectionObserver - transform properties targets the whole SVG animation and not class

我正在嘗試讓 svg animation 在視口中啟動。 它可以工作，但是當添加transform properties時，整個 svg 而不僅僅是目標 class 會受到影響。 這就是我工作的CSS（並且沒有變換屬性） 我試圖直接移動ref so ut 目標 svg 但老實說我不知道​​如何解決 ...

react-intersection-observer 模塊的實現不適用於多個組件

[英]Implementation of react-intersection-observer module not working on multiple components

我正在為“react-intersection-observer”的實施而苦苦掙扎，我終其一生都找不到解決方案。 細節： 我有一個簡單的演示網站，我想用 React 來做，這樣我也可以學習。 目前該網站只有主頁，主頁目前有以下部分：header、關於、投資組合和聯系表。 我想做的是在每個部分（關於、 ...

我們如何在 Intersection Observer 中指定元素應保留在視口上的時間

[英]How can we specify the time upto which an element should remain on viewport in Intersection Observer

我正在使用Intersection Observer API來檢測出現在視口上的元素。 但我也希望元素應在視口上保持至少 3 秒，然后在此之后檢測到。 我該怎么做？ 下面給出的是我正在使用的代碼。 ...

react-intersection-observer 僅適用於最后一個元素

[英]react-intersection-observer only works with the last elements

我正在嘗試使用react-intersection-observer構建延遲加載功能，目標是只加載位於視口中的框中的圖像。 目前，當我滾動到最后一個元素時——它會渲染出盒子的所有圖像。 但是當我向上滾動並且最后一個框超出視口時，頂部的所有內容都會消失。 如果我打印出inView ，當滾動到最后一個元 ...

Framer animation 使用 React Intersection Observer。 需要多個動畫但只得到一個

[英]Framer animation using react intersection observer. Need multiple animations but get only one

我正在嘗試使用 Framer Motion 和react-intersection-observer package 將相同的 animation 分配給一個組件的多個實例 這導致 animation 僅在滾動到最后一個 LevelWrapper 組件時加載。 然后將“inView”設置為 true ...

交叉口觀察者 API 與反應

[英]Intersection Observer API with react

我正在嘗試在用戶與交叉路口觀察者 API 滾動的頁面上創建導航跟蹤器，並且跟蹤器顯示頁面上的哪個部分的反應類似於網站中顯示的內容，帶有此鏈接https://olaolu.dev/滾動更改的框（滾動指示器），我已經創建了一個代碼沙箱。 任何可以幫助我的人都意義重大。 一直在這里出錯，甚至不知道該怎么做 ...

檢查元素是否在視口中但具有映射的參考 - ReactJS

[英]Check if an element is in the viewport but with mapped refs - ReactJS

我想知道是否有人可以提供幫助。 我一直在研究許多解決方案來檢查元素何時顯示在視點中，目前正在嘗試將此方法集成到我的項目中 -https://www.webtips.dev/webtips/react-hooks/element-in- viewport ，此方法使用 refs 但是我希望頁面上的內 ...

在視口中使用 FramerMotion useTransform Animation

[英]Using FramerMotion useTransform Animation while in viewport

我正在嘗試使用幀運動和反應交叉觀察者來設置一些基於滾動的動畫。 我想在滾動到視圖時對同一頁面上的不同部分使用相同的 animation。 我可以讓 intersection-observer 與一些基本的 animation 一起正常工作，但我不確定如何讓它與 useTransform 一起工作。 ...

Intersection Observer API 進入無限渲染循環

[英]Intersection Observer API going into infinite rendering loop

當用戶開始滾動時，我正在嘗試使用交叉點觀察器 API 有條件地在 CSS 網格中顯示項目，但似乎 go 進入無限渲染循環。 這是我的代碼。 這是我在 StackBlitz 上的實時代碼的鏈接另外，我要實現的目標是在可以避免的情況下不要在屏幕上渲染太多項目。 我不確定是否display: none實際 ...

Framer Motion Animate Presence 退出問題

[英]Framer motion Animate Presence exit issue

我遇到了 framer-motion AnimatePresence 組件的問題。 我試圖在組件在視口中可見后開始動畫，為了實現這一點，我使用了 react-intersection-observer。 它按預期用於開始動畫，但退出動畫中斷，我不確定是什么導致了問題。 我在https://codes ...

無法從不同組件警告的 function 主體內部更新組件

[英]Cannot update a component from inside the function body of a different component warning

我編寫了一個名為 component1 的組件，如下所示，它位於父組件內部。 component1 位於頁面底部，除非用戶向下滾動到該區域，否則我不想呈現它。 因此，我使用“react-intersection-observer”中的 InView 來確定該區域是否在視圖中。 如果是這樣，則獲取數 ...

React ref.current 在 useLayoutEffect 中未定義

[英]React ref.current is undefined in useLayoutEffect

我正在嘗試為項目的水平滾動部分實現 POC。 我在水平滾動部分上方有 3 個彼此相鄰的 h3，這些 h3 應該對應於水平位中的各個子部分。 我正在使用 react-intersection-observer 創建子部分的引用，以便在用戶單擊其中一個 h3 時能夠滾動到它們。 state 設置正確， ...

React-spring 如何正確地為數組的字母設置動畫

[英]React-spring how to animate letters of an array correctly

在這段帶有react-spring代碼中，我得到了一個動畫，其中每個字母都等待上一個動畫結束，同時它正在被動畫化 為什么會發生這種情況，我該如何解決？ const text = [...'hey there how are you'] const from = { transform: 'r ...


排序:
質量:
 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM