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)