React JS动画手风琴-使用细节和摘要构建

文章/答案/技术大牛

发布

1回答

javascript、css、reactjs

我目前正在使用<details />和<summary />在React中构建一个自定义手风琴这是我到目前为止所拥有的- codesandbox 正如您在codesandbox中看到的，一个奇怪的问题正在发生每次我点击一个手风琴，只显示最后一个项目的内容。我不知道是什么导致了这个奇怪的问题。

浏览 17提问于2020-09-14得票数 0

回答已采纳

1回答

如何从子组件中访问父道具-反应性

reactjs、components、react-props、react-context

假设我想构建一个可重用的react组件，它将有一个AccordionSummary和一个AccordionDetails子组件，如下所示： <AccordionTitle>Thisif the user clicks the accordion title </AccordionSummary>如何制作它，以便当单击AccordionTitle时，摘要将显示给相应的手风琴在这种情况下，

浏览 2提问于2022-11-01得票数 1

回答已采纳

1回答

如何使所有的UIkit手风琴打开负载与ReactJS和UIKit？

reactjs、uikit

我正在构建一个ReactJS应用程序，使用UIkit，我使用手风琴组件，我希望在页面加载时扩展所有手风琴。我试着使用这段代码： var accordion = UIkit.accordion(UIkit.$(this), true, false); // animated true and collapse false}); 但是我在&

浏览 2提问于2016-12-23得票数 0

回答已采纳

4回答

Material:仅通过单击图标来展开手风琴

css、reactjs、material-ui、accordion、modern-ui

我为我的项目制作了手风琴。但是，我希望面板只有在单击展开图标时才能展开。目前，它正在扩展单击面板上的任意位置。我们能定制它的扩展行为吗？代码：import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import Accordion

浏览 15提问于2021-09-28得票数 5

2回答

HTML5细节和概要可用性关注

javascript、html、accessibility、usability

新的HTML5细节和摘要元素，目前已在Chrome 12中实现。我希望通过给用户一个清晰的视觉提示来提高可用性。因此，我要防止JavaScript.When中的默认行为摘要元素被切换(单击或键盘)，如果细节元素被关闭，或者当细节元素打开时，幻灯片向下动画开始。如果元素是打开的，则在动画完成时删

浏览 3提问于2011-06-30得票数 1

回答已采纳

1回答

仅对手风琴使用css引导

reactjs、css-animations、bootstrap-accordion

我正在工作的反应-自举手风琴，我已经准备了一个良好的工作演示。我喜欢手风琴如何打开和关闭的动画。这里发生的事情是，我没有在项目的其他部分使用bootstrap css。所以我只需要手风琴的鞋带。是否可以使用bootstrap.min.css中唯一的手风琴CSS？因为只为css的156KB加载accordion似乎有点不寻常。这是我尝试过的im

浏览 3提问于2020-01-21得票数 0

1回答

字压元件:手风琴上悬停时展开/倒塌

javascript、html、jquery、wordpress、elementor

我使用wordpress和元素相加。尽管它提供了非常雪橇的手风琴，它在点击时工作得很好，但我想在悬停时展开/折叠手风琴。使用下面的JQuery，它可以工作，但不像使用CSS那样干净，所以没有手风琴的动画/慢加载。JS非常新，但是有人能帮我复制“动画/慢加载”，就像单击手风琴元素那样吗？

浏览 6提问于2020-08-02得票数 0

3回答

添加到div中的未解释的内联CSS

jquery、css、html、jquery-ui

我去添加了一个Jquery手风琴菜单，在我开始调整之前，一切看起来都很棒。

浏览 1提问于2014-02-18得票数 0

回答已采纳

1回答

用knockout.js制作手风琴

javascript、model-view-controller、view、knockout.js

"company": "BOW", "length": "30" ]},我想要构建一个手风琴现在，在我不使用Knockout.js的项目中，我只使用普通活动对象的Id来链接手风琴头部的ID属性和手风琴主体元素中的na

浏览 0提问于2012-12-03得票数 4

1回答

Reactjs下拉菜单、弹出窗口、模态、选项卡、classToggling

javascript、reactjs

我正在用reactjs构建我的最终项目视图。我正面临着几个麻烦，我想要好的方法来解决这些问题。何时使用对象以及何时为状态使用数组。

浏览 12提问于2017-08-26得票数 0

回答已采纳

2回答

如何提高反应性本机应用程序的性能

react-native

使用平面列表来呈现数据。但这还不够，构建安卓系统。不幸的是，这是一个巨大的性能差距。

浏览 11提问于2022-01-31得票数 2

1回答

如何隐藏手风琴内容在反应-本机-可折叠

react-native、react-native-collapsible

我使用的反应-本机-折叠在我的应用程序，以实现手风琴视图。 const SECTIONS = [ title: 'First', content: 'Lorem i

浏览 3提问于2019-01-04得票数 0

回答已采纳

1回答

顺风高度转换

javascript、css、reactjs、jsx、tailwind-css

</div> 我将“高度”属性添加到我的尾风use配置文件中，以允许我使用“高度”属性，但它似乎仍然没有创建动画。它只显示和隐藏。

浏览 7提问于2022-06-16得票数 0

1回答

模态内顺风高度转换

reactjs、css-animations、css-transitions、tailwind-css

我有一个模式(写在反应，但这并不重要)，并在里面，我试图添加一个手风琴。我的手风琴上下滑动得很好，我的问题是，根据手风琴的转换，模态的高度会立即上下跳跃。有没有办法使模态高度沿手风琴边的过渡方向增长？谢谢编辑：重述问题。

浏览 3提问于2020-11-04得票数 6

3回答

复制很酷的下拉内容的TRying

jquery、css、html、drop-down-menu

我刚刚看到了这个页面：我想在我的网站上使用它，我不会使用动态数据。我正在试着弄清楚这个方法叫什么，或者是否有它的教程。

浏览 1提问于2012-02-29得票数 1

回答已采纳

1回答

如何使用Azure DevOps构建React应用程序？

reactjs、azure-devops、snowpack

我们可以使用Azure DevOps中的"WebPack“或"SnowPack”这样的构建工具来构建React应用程序吗？

浏览 2提问于2022-01-03得票数 0

2回答

具有嵌套子对象的动态嵌套折叠

javascript、reactjs

我正在尝试构建一个可重用的手风琴，我能够创建一个只有一个级别的手风琴，但在这里我坚持使用嵌套的手风琴。我到目前为止所尝试的 App.js import ".item);}); return listItems; } 添加了codesandbox 我是react

浏览 20提问于2021-05-03得票数 1

回答已采纳

1回答

反应弹簧的初始动画不起作用

reactjs、react-spring

我使用react动画的转换，打开和关闭一个手风琴组件，显示一些文本。使用文档中的示例，我提出了一个更简单的版本，该版本为高度和不透明度创建了一个转换： }} {text}

浏览 4提问于2021-12-25得票数 0

回答已采纳

1回答

使用Semantic-UI React组件自动滚动到React中的内容

javascript、reactjs

我使用的是这里提供的“带样式的”手风琴：我想让窗口滚动到点击内容，这样用户就不必在点击后向下滚动。我试过使用裁判，但我似乎没有正确地这样做。任何帮助或建议都将不胜感激。下面是我的代码： import React, { Component, useRef, use

浏览 3提问于2020-04-19得票数 0

1回答

嵌套列表的树导航

javascript、jquery、list、html-lists

问题是:我想打开内部UL，只要点击了内部的LI，我就能得到点击的内部Ul的索引，但不能全局使用该索引变量。每当我单击任何链接时，页面都会重新加载，那么是否有使用cookie的解决方案？？<li><a href="#" class="odd">Add Country</a></li> </li> 这是Js<

浏览 1提问于2013-03-20得票数 1

点击加载更多