小编cha*_*mre的帖子

如何将新的 @Shopify/app-bridge 与 @Shopify/polaris-react 一起使用

Shopify 最近发布了新的@shopify/app-bridge,但我不清楚它应该如何与@shopify/polaris一起使用。

例如,我尝试制作一个 React 组件,它将使用 app-bridge 和 Polaris 来显示 toast。

import React, { Component } from "react";
import * as PropTypes from "prop-types";
import { Toast } from "@shopify/app-bridge/actions";
import { Page } from "@shopify/polaris";

class Start extends Component {
  static contextTypes = {
    polaris: PropTypes.object
  };

  showToast() {
    console.log("SHOW TOAST");
    console.log(this.context.polaris.appBridge);
    const toastNotice = Toast.create(this.context.polaris.appBridge, {
      message: "Test Toast",
      duration: 5000
    });
    toastNotice.dispatch(Toast.Action.SHOW);
  }

  render() {
    this.showToast();
    return (
      <Page title="Do you see toast?">
        <p>I …
Run Code Online (Sandbox Code Playgroud)

shopify reactjs polaris

6
推荐指数
1
解决办法
3225
查看次数

标签 统计

polaris ×1

reactjs ×1

shopify ×1