React路由器CSSTransitionGroup只能在transitionAppear上运行

文章/答案/技术大牛

发布

1回答

javascript、css、reactjs

路由工作得很好，但是动画转换就不能了，只有一个transitionAppear例外(如果我直接打开一个特定的url，它就可以在任何页面上工作)。我的主要app.js组件： import React from 'react'; import {CSSTransitionGroup} from 'react-transition-grou

浏览 19提问于2020-10-14得票数 0

1回答

ReactCssTransitionGroup使用React route.link pageTransition

javascript、css、reactjs、react-router、reactcsstransitiongroup

版本react：'15.2.1‘react addons-css-transition group：'15.2’react路由器：'2.6.0‘var ReactRouter = require("react-router"); var CSSTransitionGroup</e

浏览 2提问于2016-10-26得票数 1

1回答

如何编写高阶组件的类型注释？

javascript、reactjs、flowtype

我想为我的react 15.6项目编写一个，但我不知道如何为它编写类型注释。1.像typeof Component一样这对我来说似乎是对的，因为类实际上是一个函数。但是函数的类型是否应该写成()=>Component<*>呢？在下面的代码中，any的使用是否正确？// @flow const faded = (component

浏览 0提问于2017-09-01得票数 2

1回答

第一次使用React转换组时遇到问题

reactjs、reactcsstransitiongroup

我写这段代码是为了测试React转换组库，最终遇到了这个错误。脚本开始运行，我在页面上看到数据填充表单，但当我单击submit按钮时，表单不会消失。import React, { Component } from 'react';};

浏览 2提问于2017-07-13得票数 1

2回答

响应17.0.1-当div进入视口时如何触发动画？

reactjs、css-animations、react-transition-group、web-animations、react-animations

我正在开发一个使用React.js构建的网络应用程序。当div进入视口时，我想触发一个动画。目前，我可以运行动画，但动画不等待div进入视窗。我使用来自CSSTransitionGroup包的react-transition-group实现了动画。transitionName="request-form"

浏览 3提问于2021-01-31得票数 1

回答已采纳

3回答

反应组分与CSSTransitionGroup

javascript、css、reactjs

.5s ease-in; opacity: 0.01;用于ReactJS v12.1的JSX

浏览 5提问于2014-12-09得票数 13

回答已采纳

1回答

我使用的是react transition group中的CSSTransitionGroup，我有一个页面显示了几个对象，这些对象都经过一些过滤器(每个过滤器都会改变数组的状态--否则不能这样做)。我希望只在一个元素上激活离开转换(当对象的计时器达到0时)。编辑：我的数组中的每个对象都是包含多个信息的拍卖，包括一个计时器。auctionfinished={this.deleteAuction} offerBid={this.offerBid}

浏览 1提问于2017-06-24得票数 0

1回答

警告:失败的propType: transitionAppearTimeout没有提供给ReactCSSTransitionGroup (React.js)

animation、reactjs、reactcsstransitiongroup

我的代码运行良好，但我得到了这个恼人的错误。有什么问题吗？警告:失败的propType: transitionAppearTimeout没有提供给ReactCSSTransitionGroup:这可能会导致不可靠的动画，并且不会在未来的React版本中得到支持render: function() { <ReactCSSTransitionGroup transitionName="example" transitionAppear</div>

浏览 4提问于2016-03-02得票数 0

回答已采纳

1回答

React不承认DOM元素上的“传递形式”。如果您有意希望它以自定义属性的形式出现在DOM中

datepicker、material-ui、redux-form、reactcsstransitiongroup

React不识别DOM元素上的transitionAppear、transitionAppearTimeout、transitionEnter和transitionEnterTimeout道具。我在开发人员工具中检查了它，这些转换属性实际上是从其父CSSTransitionGroup传递给子div的。因此，DatePicker对话框无法按预期工作。

浏览 0提问于2018-02-20得票数 3

1回答

转换在react路由器4中部分工作

reactjs、react-router、react-transition-group

我正在尝试使用react router 4和CSSTransitionGroup在路由之间进行动画转换。显示为部分工作-进入零部件有时会根据需要(但不总是)进行动画显示，退出零部件将消失而不会过渡。以下是未按预期运行的render函数： // const locationKey = this.props.location.p

浏览 11提问于2018-02-14得票数 1

回答已采纳

1回答

我可以使用ReactTransitionGroup在更新时创建转换吗？

reactjs

查看，react组件在其生命周期中有三个项：mount、unmount和update。似乎是应用转换和动画的最常见的方式。它是否也可用于更新(即状态转换)，或仅当项目被安装/卸载？

浏览 0提问于2017-01-04得票数 1

回答已采纳

1回答

对React.js中不存在的元素进行动画处理

javascript、reactjs

我的目标是使用react将这个无序列表的外观动画化。我使用的是中描述的React.addons.CSSTransitionGroup。var React = require('react/addons');

浏览 0提问于2015-11-12得票数 0

1回答

未调用react-transition-group生命周期方法componentWillLeave

reactjs

如果有什么不同的话，我也在使用React路由器。任何帮助都将不胜感激。import React, { Component } from 'react';import PropTypes from 'prop-types

浏览 0提问于2017-06-15得票数 0

2回答

在子路由之间移动时，防止父路由上的react路由器转换

react-router、reactcsstransitiongroup

我已经设置了一个带有动画过渡的路由器。当用户从/topics/rendering移动到/topics/components时，是否可以仅在子路由上触发转换，而不是转换整个页面。现场示例：import { render } from 'react-dom' import { BrowserRouter as Router,Route, Switch, Link } from

浏览 14提问于2017-07-07得票数 1

2回答

ReactJS onClick ReactCSSTransitionGroup动画

javascript、animation、reactjs、reactcsstransitiongroup

因此，在页面加载上使用“出现”动画，一切都正常。但现在我有问题了。当我点击导航时，我希望新的div不只是立即出现，而是慢慢淡入(或任何其他动画为母亲)，但它不工作。import React from "react";import ReactCSSTransitionGroup from "react-addons-css-transition-group"; export d

浏览 2提问于2016-06-27得票数 1

回答已采纳

2回答

React CSS转换组

reactjs、reactcsstransitiongroup

我无法在使用CSSTransitionGroup的上滑效果中获得所需的缓解效果。代码示例可以在此处找到任何帮助都将不胜感激。谢谢

浏览 16提问于2017-07-04得票数 0

回答已采纳

1回答

用React.js和Ajax在Laravel 5中显示验证错误

ajax、laravel-5、reactjs、laravel-validation

我正在运行一个Laravel 5应用程序，它的主视图使用React.js呈现。在页面上，我有一个简单的输入表单，我正在处理Ajax (在不刷新页面的情况下发送输入)。我还希望根据React.js代码中的状态(提交或未提交)显示验证错误。React.js代码： var Sign

浏览 5提问于2015-07-18得票数 6

2回答

导入语句不起作用

javascript、reactjs

在Apache+Firefox上一切都很好。......./react-transition-group/CSSTransitionGroup.js......./rea

浏览 2提问于2017-04-15得票数 0

回答已采纳

2回答

反应:动画页面切换

javascript、animation、reactjs、transition、reactcsstransitiongroup

到目前为止，我拥有的是一个LayoutComponent，它将页面组件呈现为一个CSSTransitionGroup。page: '' }; this.setState({ page }); return ( {this.state.page}

浏览 7提问于2015-07-01得票数 5

2回答

缓解React中的过渡

css、reactjs

我刚开始使用React，遇到了一个问题，我本以为会很简单的。我想做的就是让一个文本块淡入，然后基于一个简单的触发器淡出，但我不能让它淡出。class MessageSender extends React.Component { let sent_element = null;this.setState({lin

浏览 0提问于2015-10-31得票数 4

点击加载更多