1

我正在使用 Shopify Polaris @3.4.0 和 App-Bridge @1.0.3。还使用 shopify-node-app 作为开始。

我通过传递 apiKey 和 shopOrigin 值来初始化 app-bridge,如下所示:

<AppProvider apiKey={apiKey} shopOrigin={shopOrigin} 
  <Switch>
      <Route exact path='/admin' component={Dashboard} />
  </Switch>
</AppProvider>

在我的仪表板组件中,我有一个 Modal 组件:

<Modal
   src='https://somewhere/',
   title='title',
   open={modalActive}
/>

我通过将 modalActive 的状态设置为 true 来打开模态,如下所示:

 this.setState({modalActive: true});

Shopify Polaris Modal 在使用src时使用 iframe,并且在该视图中我有一个提交表单。我想在提交表单时关闭模态。我曾尝试使用 app-bridge 发送一个操作来关闭模式,但老实说,我很困惑,这些都是最新版本,因此感谢您的帮助。

4

2 回答 2

0

长话短说,将一个函数传递给 Modal primaryAction 道具。其核心是子组件到父组件的状态更改。所以更多的是一个 ReactJS 问题。

于 2019-01-17T01:01:32.313 回答
0

好吧,有一个类似的问题,承认这一点有点尴尬,但是嘿,如果它可以为你节省一个半小时,那就太好了。

Shopify 的模态文档用于active保持外部触发模态的状态。但不要忘记open用作组件的实际道具<Modal>

<Modal
  open={active}
  ...rest of props
/>
    ...content
</Modal>
于 2020-08-22T17:21:24.903 回答