dan gaearon

This Page Has Moved To:

https://reactjs.org/docs/javascript-environment-requirements.html

JavaScript Environment Requirements

React 16 depends on the collection types Map and Set. If you support older browsers and devices which may not yet provide these natively (eg <IE11), consider including a global polyfill in your bundled application, such as core-js or babel-polyfill.

A polyfilled environment for React 16 using core-js to support older browsers might look like:

import 'core-js/es6/map';
import 'core-js/es6/set';

title	author
Error Handling in React 16	gaearon

As React 16 release is getting closer, we would like to announce a few changes to how React handles JavaScript errors inside components. These changes are included in React 16 beta versions, and will be a part of React 16.

Behavior in React 15 and Earlier

In the past, JavaScript errors inside components used to corrupt React’s internal state and cause it to emit cryptic errors on next renders. These errors were always caused by an earlier error in the application code, but React did not provide a way to handle them gracefully in components, and could not recover from them.

Thanks everyone for participating in the quiz!
Many of you have posted correct answers.

What we know:

A top-level App component returns <Button /> from its render() method.

Question:

>What is the relationship between `` and this in that `Button`’s `render()`?

A top-level App component returns <Button /> from its render() method.

What is the relationship between <Button /> and this in that Button’s render()?
Does rendering <Button><Icon /></Button> guarantee that an Icon mounts?
Can the App change anything in the Button output? What and how?

	{
	"editor.fontFamily": "Consolas",
	"editor.fontSize": 18,
	"editor.lineHeight": 26,
	"editor.minimap.enabled": false,
	"editor.renderIndentGuides": false,
	"editor.renderLineHighlight": "none",
	"javascript.validate.enable": false,
	// "workbench.colorTheme": (find something that looks like Oceanic Next and put it here)
	"window.zoomLevel": -1,

	class Example extends React.Component<
	Props,
	State,
	Snapshot
	> {
	static getDerivedStateFromProps(
	nextProps: Props,
	prevState: State
	): $Shape<State> \| null {
	// ...

	/**
	* Copyright (c) 2015-present, Facebook, Inc.
	*
	* This source code is licensed under the MIT license found in the
	* LICENSE file in the root directory of this source tree.
	*/

	// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
	// /!\ DO NOT MODIFY THIS FILE /!\
	// ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

	/*
	This replaces <Sequencer> + multiple <Sampler>s with a marble diagram sequencer.
	You can use it like this:

	<Marble
	resolution={16}
	samples={[
	'samples/kick.wav',
	'samples/snare.wav',
	]}

	class Boundary extends Component {
	constructor(props) {
	super(props);
	this.state = { err: null };
	}

	unstable_handleError(err) {
	report(err);
	this.setState({ err })
	}