Shopify ResourcePicker не отображается - PullRequest
0 голосов
/ 04 января 2019

Компонент Polaris ResourcePicker вообще не отображается в моем встроенном приложении, и я не знаю почему.Вот мой код:

import React from "react";
import ReactDom from "react-dom";
import * as PropTypes from 'prop-types';

const session     = require('express-session');

import {AppProvider, Page } from '@shopify/polaris';
import {ResourcePicker} from '@shopify/app-bridge/actions';

class ExchangeApp extends React.Component {
  // This line is very important! It tells React to attach the `easdk`
  // object to `this.context` within your component.
  static contextTypes = {
    easdk: PropTypes.object,
  }; 

  state = {
    resourcePickerOpen: true,
  };

  render() {
    return <ResourcePicker
      resourceType="Product"
      open={this.state.resourcePickerOpen}
      onSelection={({selection}) => {
        console.log('Selected products: ', selection);
        this.setState({resourcePickerOpen: false});
      }}
      onCancel={() => this.setState({resourcePickerOpen: false})}
    />;
  }
}

ReactDom.render(
    <AppProvider apiKey="532cc1c7fa852e9bbf61c71bcbaa5a74">
      <ExchangeApp />
    </AppProvider>,
    document.querySelector('#root'),
  );

В консоли браузера я получаю следующую ошибку:

main.js:3584 Uncaught Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

Check the render method of `ExchangeApp`.
at invariant (main.js:3584)
at createFiberFromTypeAndProps (main.js:13629)
at createFiberFromElement (main.js:13650)
at reconcileSingleElement (main.js:17327)
at reconcileChildFibers (main.js:17384)
at reconcileChildren (main.js:17753)
at finishClassComponent (main.js:18080)
at updateClassComponent (main.js:18018)
at beginWork (main.js:18864)
at performUnitOfWork (main.js:21679)

Заранее большое спасибо за любую помощь!

1 Ответ

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

Импорт ResourcePicker из @ shopify / polaris, а не из easdk.

Также возвращаемый результат рендеринга должен быть заключен в скобки

return (<ResourcePicker.../>);
...