react-smooth-collapse:React组件用于动画显示或隐藏元素

时间:2024-05-26 10:04:15
【文件属性】:

文件名称:react-smooth-collapse:React组件用于动画显示或隐藏元素

文件大小:120KB

文件格式:ZIP

更新时间:2024-05-26 10:04:15

JavaScript

React平稳崩溃 使用此组件可以设置元素高度的动画,以显示或隐藏其内容。 动画会自动调整为内容的自然高度。 可以在此处尝试一个示例: 您可以在example目录中找到其代码。 该示例可以通过运行以下命令进行编译: yarn yarn example-build # or use this to auto-rebuild on changes: yarn example-watch 问:当我可以为元素上的高度设置过渡规则,然后将高度从“自动”更改为“ 0”时,为什么要使用此规则? 答:您无法通过“自动”制作动画。 将该元素展开时,此组件的高度设置为“自动”,当该元素设置为折叠时,该元素的高度设置为等于其当前高度,然后设置为“ 0”,以使其动画设置正确。 问:我不能通过设置max-height的过渡规则,在元素展开时将max-height设置为非常大的值,然后在元素折叠时将max


【文件预览】:
react-smooth-collapse-master
----example()
--------Example.js(1KB)
--------index.html(331B)
--------main.js(597B)
--------main.css(143B)
----.babelrc(205B)
----flow-typed()
--------npm()
----.flowconfig(269B)
----package.json(2KB)
----__tests__()
--------index.js(9KB)
--------getTransitionTimeMs.js(743B)
----src()
--------index.js(6KB)
--------getTransitionTimeMs.js(292B)
----.eslintrc.js(1KB)
----tsconfig.json(172B)
----index.d.ts(379B)
----.gitignore(64B)
----CHANGELOG.md(2KB)
----.circleci()
--------config.yml(1KB)
----README.md(4KB)
----yarn.lock(254KB)
----.eslintignore(35B)
----.editorconfig(132B)
----LICENSE.txt(1KB)
----.vscode()
--------settings.json(77B)

网友评论