그리고 클래스 상단에 static contextType 값을 지정해 주세요.

components/SelectColors.js

import React, { Component } from 'react';
import ColorContext from '../contexts/color';
 
const colors = ['red', 'orange', 'yellow', 'green', 'blue', 'indigo', 'violet'];
 
class SelectColors extends Component {
  static contextType = ColorContext;
  render() {
    return (
      <div>
        <h2>색상을 선택하세요.</h2>
        <div style={{ display: 'flex' }}>
          {colors.map(color => (
            <div
              key={color}
              style={{
                background: color,
                width: '24px',
                height: '24px',
                cursor: 'pointer'
              }}
            />
          ))}
        </div>
        <hr />
      </div>
    );
  }
}
 
export default SelectColors;

---