O'Reilly logo

React 16 Tooling by Adam Boduch

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Manipulating element state values

React Developer Tools lets you inspect the current state of elements that you select. You can also monitor state changes as they happen, as was demonstrated in the preceding section where you had set up an interval timer that changed the state of your element over time. The state of an element can also be manipulated in limited ways.

For this next example, let's modify the MyList component to remove the interval timer and simply populate the state when it's constructed:

import React, { Component } from 'react'; 
import MyItem from './MyItem';class MyList extends Component { 
  timer = null; 
  state = { 
    items: new Array(10).fill(null).map((v, i) => ({ 
      label: 'Item ${i + 1}', 
      strikethrough: false })) }; onItemClick ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required