react: отрисовка разных компонент с параметрами в зависимости от значения переменной

подскажите как более правильно решить следующую задачу:

есть несколько разных компонент с разными параметрами: <Panel1 data = {this.state.data1} /> и <Panel2 value = {this.state.value2} /> и т.д.

они отрисовываются строго по одному (т.е. одновременна несколько не отрисовываются) в зависимости от значения переменной this.state.panel

Сейчас делаю так:

<>
    {this.state.panel === 'panel1' && <Panel1 data = {this.state.data1} />}
    {this.state.panel === 'panel2' && <Panel2 value = {this.state.value2} />}
    ...
</>

все работает, вопросов нет

но может есть более корректный и правильный способ? просто смущает, что используется одна и та же переменная this.state.panel и можно сделать покороче

т.е. что-то на подобии питоновского get для словарей:

{
    'panel1': <Panel1 data = {this.state.data1} />, 
    'panel2': <Panel2 value = {this.state.value2} />
}.get(this.state.panel, <></>)

Ответы (0 шт):