React:使用Animated.css时未显示animationOut
React是一个用于构建用户界面的JavaScript库。它通过组件化的方式，将用户界面拆分为独立且可复用的部分，使得开发者能够更加高效地构建交互式的Web应用程序。
在React中使用Animated.css时未显示animationOut的原因可能有以下几个方面：
- 引入Animated.css的方式不正确：Animated.css是一个用于添加动画效果的CSS库，需要正确引入才能生效。在React中，可以通过在组件中引入Animated.css的CSS文件，或者使用npm包管理工具安装Animated.css并在组件中引入。
- 动画元素未正确设置className：在React中，通过给元素添加className来应用CSS样式。在使用Animated.css时，需要将对应的动画类名添加到需要应用动画的元素的className中，才能触发相应的动画效果。
- 动画元素未正确渲染：在React中，组件的渲染是通过render函数来实现的。如果动画元素未正确地被渲染到DOM中，那么动画效果就无法显示。需要确保动画元素在组件的render函数中正确地被渲染，并且在适当的时机触发动画。
- 动画元素的状态未正确管理：在React中，组件的状态管理是非常重要的。如果动画元素的状态未正确管理，比如未正确设置动画的开始和结束状态，那么动画效果就无法正常显示。需要确保在组件的状态管理中正确地设置动画元素的状态，以触发相应的动画效果。
推荐的腾讯云相关产品：腾讯云云开发（CloudBase）是一款无服务器云开发平台，提供了丰富的后端服务和前端开发框架，可以帮助开发者快速构建和部署React应用。腾讯云云开发支持自动部署、云函数、云数据库、云存储等功能，可以满足React应用的后端需求。
腾讯云云开发产品介绍链接地址：https://cloud.tencent.com/product/tcb
相关·内容
1回答
React:使用Animated.css时未显示animationOut
javascript、reactjs、animate.css
我有一个隐藏/显示内容的切换示例。我使用了https://www.npmjs.com/package/react-animated-css，它在显示内容时工作得很好，这意味着在显示内容之后，动画正在播放。我检查了控制台，animationOut的类正在工作，但似乎内容在动画有时间播放之前就关闭了，所以它是隐藏的。 如何解决此问题？file=src/App.js import React, {
浏览 47提问于2021-04-03得票数 1
回答已采纳
1回答
如何使我的单页应用程序(SPA)的反应渲染有条件的？
css、reactjs、animation
也就是说，呈现应该在用户向下滚动以查看页面上不同的节时，在我的页面上呈现每个节，因为我希望当用户查看该组件时，组件是动画，而不是所有这些组件都是动画的。/img/Sydney.jpg')} />
<Animated animationIn="zoomIn" animationOut="zoomOut" isVisible={true}><h3>Web/Mobile Apps Developer</h3>
浏览 1提问于2018-01-13得票数 1
3回答
如何在React JS中应用动画
javascript、reactjs、react-animated
我正在使用react-animated-css库在React JS中对状态更改应用动画。代码如下： import ReactDOM from "react-dom";import { Animated }from "react-animated-css";
const animationIn = "fadeInLe
浏览 47提问于2019-06-12得票数 4
回答已采纳
3回答
React Native Modal不显示动画
javascript、reactjs、react-native
因此，在我的应用程序中，我有一个工作模式，它显示可见性是否设置为true。我使用的是react-native-modal包。有人知道为什么会这样吗？this.props.visible}
浏览 0提问于2019-04-12得票数 0
2回答
在带有react-animated-css的ReactJS中使用Animate.css
css、reactjs、animation、animate.css、react-animated
我正在尝试在React中实现Animate.css，通过我的研究，我发现react-animated-css包似乎非常简单，但是我不能让它工作。在文档中(如果可以称之为文档)，有人说用户应该在超文本标记语言页面中包含Animate.css，我没有这样做，因为我正在使用React，没有超文本标记语言页面，但我是通过npm安装animate.css() {
<div> animationIn="fadeInDown
浏览 33提问于2020-07-02得票数 0
4回答
在数组中添加多张照片
arrays、reactjs、photo
Menu.jsimport {Animated} from "react-animated-css";
<Animated animationIn="fadeIn" animationOut
浏览 1提问于2021-02-27得票数 1
回答已采纳
1回答
如何在React Native中使用自定义警报？
javascript、react-native、alert
我已经在React Native中创建了一个自定义警报作为组件。我使用Modal创建了这个自定义警报。我的问题是，如何使用它？我希望显示我自己的警报，而不是在React Native中使用Alert.alert。 这是我的Custom Alert Modal。import React, { Component } from 'react';
import { Text, View } from 'react</em
浏览 17提问于2019-05-26得票数 1
回答已采纳
1回答
Typescript不允许将道具传递给具有React-notification-component { children ?：ReactNode;}的子项
reactjs、typescript、children、react-notifications-component
我正在使用lib React-notifications-component创建自定义通知。我需要将id从内容属性传递给子组件(通知)，以便关闭带有onClick事件的通知。但是当尝试这样做时，TypeScript总是报告我：“属性'id‘在类型'{ children?：ReactNode；}上不存在”import { store } from 'react-notifications-component';
const notification =notificat
浏览 0提问于2021-03-09得票数 0
1回答
React-Native应用程序的TypeScript中的类型缺少以下属性
reactjs、typescript、react-native、class、interface
它从react本机和react本机模式库的几个接口扩展而来。这意味着我可以使用它们的所有属性：import { ReactNativeModal, ModalProps asthis.props.isVisible} animationIn={'slideInUp'}
animati
浏览 45提问于2020-06-04得票数 0
回答已采纳
2回答
如何在重定向到其他页面后显示react- another？
javascript、reactjs、notifications
我有一个用ReactJS开发的注册页面，我想在点击提交按钮后，它会将我重定向到登录页面，之后它会显示一个反应通知，其中的消息是response.data.message。我使用了react-notifications-component： import ReactNotification from "react-notifications-component"; container: "top-right",
浏览 22提问于2019-01-18得票数 0
回答已采纳
1回答
React Native - android -内存未释放
android、react-native、memory、memory-leaks、react-native-android
我们有一个生产应用程序，并使用'adb shell dumpsys meminfo‘来测量内存。在这个工具中进行转储时，我们看到内存在不断增长。我们看到未知的类别正在增长，并且永远不会下降。当我们附加调试器并执行JS内存快照时，我们看到内存在我们清理的地方下降了。为了简化这一点，我们创建了一个简单的应用程序来在一个屏幕上分配和释放内存。“
我正在运行简单的react本机应用程序来了解内存使用情况。当我使用chrome调试器检查内存时，它没有保留任何内存。但是当
浏览 62提问于2018-08-01得票数 1
2回答
从ReactJS项目中删除未使用的组件
javascript、reactjs、npm、jsx
我有一个React应用程序，在运行它的时候控制台中有一堆no -unused vars让我发疯，所以我恳请你们分享你们的经验:有没有这样的工具？
浏览 3提问于2021-06-05得票数 0
2回答
Xcode未反映来自react-native的最新应用程序代码
xcode、react-native、app-store、app-store-connect
我运行了以下命令：react-native bundle --entry-file index.js --platform ios --dev false --bundle-output ios/main.jsbundle--assets-dest ios/assets，并将新生成的main.jsbundle放入/ios/ProjectName中，但当我运行来自Xcode的代码时，它仍然为我提供了一个旧版本，我还尝试了清理它只是应用程序的前一个版本，我没有看到在app...this上所做的所有新更改对我来说有点奇怪我还
浏览 2提问于2020-06-24得票数 2
3回答
使用isRequired时，React PropType未显示错误
reactjs、react-proptypes
我正在尝试学习React，但即使与isRequired一起使用，PropTypes也不会抛出任何错误。我是不是做错了什么。代码如下所示 <div id="root"></div><scr
浏览 65提问于2019-01-18得票数 2
回答已采纳
1回答
使用条件时未显示的React组件
javascript、reactjs
我正在遵循来自CodeSchool的React示例。我一直能够效仿这些例子。问题是，当我尝试实现一个IF条件以将不同的数据传递给组件时。未显示的组件是“注释”。查看_getComments函数内部。如果我使用If条件，请参见，以决定哪个数组将被传递，代码将无法工作。但是，如果我简单地将下面的代码放在没有任何If的代码中，组件注释就会正确地呈现出来。id: 2, author: "author2", body: "body2"},
{id: 3, auth
浏览 0提问于2016-10-14得票数 0
回答已采纳
1回答
react-选择不能在react-modal上正确显示资源
javascript、reactjs、react-select、react-modal
我使用react-select在我用react-modal创建的模式上有一个选择字段。资产未正确显示，如图所示(箭头未显示，可显示列表未正确显示)。.Modal { z-index: 81; z-inde
浏览 0提问于2017-06-19得票数 0
2回答
仿真器在使用expo-cli对React Native使用firebase身份验证时显示错误{firebase.App() not found}
firebase、react-native、react-native-firebase、firebase-tools、expo
当通过firebase使用身份验证功能时，模拟器显示错误，即{您试图通过调用firebase.app()使用未安装在您的安卓项目中的firebase模块}.Please帮助我解决此错误。我使用Expo作为命令行输入。react-native version -0.63.6,"@react-nat
浏览 1提问于2020-10-11得票数 1
1回答
react-native-deck-swiper触摸查看配置文件
react-native、modal-dialog、expo、tinder
我正在使用react-native-deck-swiper为一个项目复制一个类似于引火线的动作。我正在尝试做的一件事是让用户点击卡片，Modal会显示出有关他/她按下的特定卡片的所有信息。( animationOut="zoomOutDown"
animationInTiming</Modal>):(<View><
浏览 15提问于2019-10-24得票数 0
回答已采纳
1回答
创建还原器以更新redux中不同组件的状态
reactjs、redux
我正在使用react和redux创建这个UI。下面是UI的图像。
现在，当单击“类别”时，它将显示数据。然后，当我点击未映射的链接时，它会显示“类别”的未映射产品。但当我点击‘加载项’，然后在未映射的链接，它仍然显示‘类别’的未映射产品。我如何写还原器，以便它显示‘加载项’的未映射产品以及。在我使用的react文件(this.p
浏览 3提问于2017-07-21得票数 0
回答已采纳
1回答
使用react-bootstrap时，在react中未显示模式
css、reactjs、bootstrap-modal、react-bootstrap
我正在尝试创建一个模式，以便在单击NavBar.Item登录/注册时弹出登录/注册窗口。 我的模式定义如下： import React from "react";import { Modal } from "react-bootstrap";
class LoginRegisterModal extendsReact<
浏览 42提问于2020-05-31得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
