标签: polaris

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 …

我是 Shopify 应用程序开发的新手，我使用 Node、Express 作为后端，并与 Polaris libaray 进行反应。

我的问题是如何获取通过应用程序发起请求的商店域名。当我搜索时，我只能找到一个在 Ruby 中使用的东西ShopifyAPI::Shop.current，我正在寻找在节点中使用的类似东西？

我正在尝试为 React修改Shopify Polaris Button组件的颜色，我尝试更改 style.css 文件但没有任何反应。

知道怎么做吗？

应用程序.js

import React, { Component } from 'react';
import '@shopify/polaris/styles.css';
import {Page, Card, Button} from '@shopify/polaris';


class App extends Component {
  render() {
    return (
      <div className="App">
        <Page title="Example app">
          <Card sectioned>
            <Button onClick={() => alert('Button clicked!')}>Example button</Button>
          </Card>
       </Page>
     </div>
   );
 }
}

export default App;

我正在尝试修改node_modules/@shopify/polaris/styles.css，但它对按钮颜色没有任何影响。