Получение данных из нескольких экземпляров CKEditor в React

Question

Я новичок в React. Я хочу динамически использовать несколько экземпляров CKEditor на странице для хранения данных на разных языках. Я использую для этого ckeditor4-react. Я хочу получить данные редакторов на основе идентификатора языка при нажатии кнопки. Поскольку у CKEditor нет собственного идентификатора, я не знаю, как это сделать.

1. Как получить данные каждого редактора, вызывая их по идентификатору языка?
2. Это хороший способ создать несколько экземпляров?

Вот мой код, как я уже сказал, я новичок в React. :)

import React, { Component } from 'react';
import CKEditor from 'ckeditor4-react';
import api from "../../appconfig/api";

class Test extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            languageList: [],
        }
    }

    componentDidMount() {

        this.getLanguages();
        this.renderBody();

    }
    render() {
        return (
            <div>
                {this.renderBody()}
                <button
                    type="button"
                    color="primary"
                    className="dash-modal-button bg-primary text-white"
                    onClick={() => this.getData()}
                >
                    Create
                </button>
            </div>
        );
    }

    getLanguages = () => {
        fetch(api + "/getlanguages", {
            method: 'GET',
        })
            .then(res => res.json())
            .then(
                (result) => {
                    console.log("Ajax Call Output Languages : " + JSON.stringify(result.data));
                    if (result.data != null && result.data != undefined) {
                        this.setState({
                            languageList: result.data,
                        });
                    }
                },
                (error) => {
                    console.log("--failed ajax call-----------" + error);
                }
            )
    }
    renderBody = () => {
        let output = [];
        for (let i = 0; i < this.state.languageList.length; i++) {
            var languageID = this.state.languageList[i].languageID;
            var language = this.state.languageList[i].language;
            output.push(<div>
                <div className="col-md-12">
                    <label>Language:&nbsp;&nbsp;&nbsp;&nbsp;{language}</label>
                </div>
                <div className="col-md-8" style={{ marginTop: '10px', marginBottom: '10px', display: "flex" }}>
                <div className="Editor">
                    <CKEditor/>
                </div>
            </div>
            </div>
            );

        }
        return output;
    }
    getData = () => {
        //I need to get data of each editor instances preferably by reference to their respective languageId.
        //don't know what to do...
    }
}
export default Test;

Спасибо!