mirror of
https://github.com/zebrajr/react.git
synced 2025-12-06 12:20:20 +01:00
Fix time slicing fixture (#13305)
* Fix time slicing fixture * Remove unused option
This commit is contained in:
parent
e341e503b2
commit
ae63110335
|
|
@ -1,4 +1,4 @@
|
|||
import React, {Component, PureComponent, unstable_AsyncMode} from 'react';
|
||||
import React, {PureComponent, unstable_AsyncMode} from 'react';
|
||||
import {flushSync, render, unstable_deferredUpdates} from 'react-dom';
|
||||
import _ from 'lodash';
|
||||
import Charts from './Charts';
|
||||
|
|
@ -64,9 +64,12 @@ class App extends PureComponent {
|
|||
}
|
||||
this._ignoreClick = true;
|
||||
|
||||
unstable_deferredUpdates(() => {
|
||||
this.setState({showDemo: true}, () => {
|
||||
this._ignoreClick = false;
|
||||
// TODO: needing setTimeout here seems like a React bug.
|
||||
setTimeout(() => {
|
||||
unstable_deferredUpdates(() => {
|
||||
this.setState({showDemo: true}, () => {
|
||||
this._ignoreClick = false;
|
||||
});
|
||||
});
|
||||
});
|
||||
};
|
||||
|
|
@ -79,15 +82,13 @@ class App extends PureComponent {
|
|||
}
|
||||
}, 1000);
|
||||
|
||||
renderOption(strategy, label, enabled) {
|
||||
renderOption(strategy, label) {
|
||||
const {strategy: currentStrategy} = this.state;
|
||||
return (
|
||||
<label
|
||||
className={strategy === currentStrategy ? 'selected' : null}
|
||||
style={{opacity: enabled ? 1 : 0.5}}>
|
||||
className={strategy === currentStrategy ? 'selected' : null}>
|
||||
<input
|
||||
type="radio"
|
||||
disabled={!enabled}
|
||||
checked={strategy === currentStrategy}
|
||||
onChange={() => this.setState({strategy})}
|
||||
/>
|
||||
|
|
@ -107,8 +108,11 @@ class App extends PureComponent {
|
|||
this.debouncedHandleChange(value);
|
||||
break;
|
||||
case 'async':
|
||||
unstable_deferredUpdates(() => {
|
||||
this.setState({value});
|
||||
// TODO: needing setTimeout here seems like a React bug.
|
||||
setTimeout(() => {
|
||||
unstable_deferredUpdates(() => {
|
||||
this.setState({value});
|
||||
});
|
||||
});
|
||||
break;
|
||||
default:
|
||||
|
|
@ -124,13 +128,9 @@ class App extends PureComponent {
|
|||
return (
|
||||
<div className="container">
|
||||
<div className="rendering">
|
||||
{this.renderOption('sync', 'Synchronous', true)}
|
||||
{this.renderOption('debounced', 'Debounced', true)}
|
||||
{this.renderOption(
|
||||
'async',
|
||||
'Asynchronous',
|
||||
false
|
||||
) /* TODO Fix async demo and re-enable */}
|
||||
{this.renderOption('sync', 'Synchronous')}
|
||||
{this.renderOption('debounced', 'Debounced')}
|
||||
{this.renderOption('async', 'Asynchronous')}
|
||||
</div>
|
||||
<input
|
||||
className={'input ' + this.state.strategy}
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user