What are Keyed Fragments?

Forums ReactWhat are Keyed Fragments?
Staff asked 2 years ago

Answers (1)

Add Answer
Staff answered 2 years ago

The Fragments declared with the explicit <React.Fragment> syntax may have keys. The general use case is mapping a collection to an array of fragments as below,

function Glossary(props) {
  return (
    <dl>
      {props.items.map((item) => (
        // Without the `key`, React will fire a key warning
        <React.Fragment key={item.id}>
          <dt>{item.term}</dt>
          <dd>{item.description}</dd>
        </React.Fragment>
      ))}
    </dl>
  );
}

 

Subscribe

Select Categories