Как разобрать данные GraphQL в редакторе Draft.js - PullRequest
Новая
       6

Как разобрать данные GraphQL в редакторе Draft.js

0 голосов
/ 09 января 2019

Я анализирую данные GraphQL, используя Apollo, в Draft.js. Как мне указать данные в createWithContent?

Я пробовал несколько вещей. Но, будучи немного новичком, я не могу добиться прорыва. 


    import React from 'react';
    import { Editor, EditorState, RichUtils, convertFromHTML, ContentState } from 'draft-js';
    import { stateToHTML } from 'draft-js-export-html';
    import styled from 'styled-components';
    import { Query } from 'react-apollo';
    import gql from 'graphql-tag';
    import PropTypes from 'prop-types';

    const TOPIC_QUERY = gql`
      query TOPIC_QUERY($id: ID) {
        topic(where: { id: $id }) {
          title
          id
          text
        }
      }
    `;

    const TopicData = ({ ID }) => (
      <Query
        query={TOPIC_QUERY}
        variables={{
          id: this.props.id
        }}
      >
        {({ data, loading, error }) => {
          if (error) return <Error error={error} />;
          if (loading) return <p>Loading...</p>;
          console.log(data.topic);
          return (
            <div>
              <p>{data.topic.text}</p>
            </div>
          );
        }}
      </Query>
    );

    const Spacing = styled.div`
      margin-top: 20px;
      border: 1px solid #000;
    `;

    export default class EditorApp extends React.Component {
      static propTypes = {
        id: PropTypes.string.isRequired
      };

      constructor(props) {
        super(props);

        const html = 'GRAPHQL SHOULD GO HERE';
        const blocksFromHTML = convertFromHTML(html);
        const content = ContentState.createFromBlockArray(
          blocksFromHTML.contentBlocks,
          blocksFromHTML.entityMap
        );

        this.state = { editorState: EditorState.createWithContent(content) };

Как вы можете видеть, у меня есть константный html, который, я считаю, должен анализировать данные. Но я просто не могу заставить его работать.

...