Магазин не переходит к подключенной сотовой связи - PullRequest
0 голосов
/ 22 февраля 2019

Я использую следующие компоненты: response v.16.5 Reaction-redux v.6.0 ag-grid v.18.1

Я использую cellRendererFramework для отображения пользовательского компонента в одной ячейке ag-grid,Однако, как только я сделаю этот пользовательский компонент подключенным,

Ошибка:

Не удалось найти «store» в контексте «Connect (TestComponent»).)».Либо оберните корневой компонент в a, либо передайте пользовательский поставщик контекста React и соответствующий потребитель контекста React в Connect (TestComponent) в параметрах соединения.

colDef в ag-grid выглядит следующим образом:

{
  field: "TestField",
  headerName: "Test Field",
  rowGroup: false,
  cellRendererFramework: TestComponent
}


// TestComponent.js
import React, {Component} from 'react';
import {connect} from 'react-redux';

class TestComponent extends Component {

  render() {
    return(<div>Hello</div>);
  }    
}

export default connect()(TestComponent);

Я создал магазин и определил провайдера на уровне Index.js.Неужели cellrendererFrameworks не может быть подключено?

Я сталкивался с этой проблемой в другом сообщении о переполнении стека, но там они сказали, что эта проблема была решена в ответной версии.13?
https://github.com/ag-grid/ag-grid-react/issues/88

Обратите внимание, что это не для написания тестового примера - мне нужно, чтобы TestComponent был фактически подключен.

Пожалуйста, кто-нибудь может помочь с этим, так как это выглядит довольнофундаментальная ошибка, из-за которой вложенные компоненты блокируются от подключения.

1 Ответ

0 голосов
/ 22 февраля 2019

Из ответов docs и lilbumbleber :

С React 16 были представлены порталы, и это предпочтительный способ динамического создания компонентов React.Если вы хотите попробовать использовать эту функцию, вам нужно включить ее следующим образом:

// Grid Definition
<AgGridReact
    reactNext={true}
    ...other bindings

Если вы используете connect для использования Redux или если вы используете более высокий порядокКомпонент, чтобы вообще обернуть компонент React, вам также необходимо убедиться, что сетка может получить доступ к вновь созданному компоненту.Для этого вам нужно убедиться, что forwardRef установлен:

export default connect(
    (state) => {
        return {
            currencySymbol: state.currencySymbol,
            exchangeRate: state.exchangeRate
        }
    },
    null,
    null,
    { forwardRef: true } // must be supplied for react/redux when using GridOptions.reactNext
)(PriceRenderer);

Итак, вы можете попробовать добавить эти два:

  1. Добавить reactNext={true} к <AgGridReact/> компоненту
  2. Изменить connect()(TestComponent); на connect(null, null, null, { forwardRef: true })(TestComponent);

Редактировать: эта ошибка была исправлена ​​в версии 20.x

...