向react应用程序添加一点服务器端动态客户端javascript

Adding a bit of server-side dynamic client javascript to a react app

本文关键字：服务器端 一点 动态 客户端 javascript 应用程序 react 添加      更新时间：2023-09-26

我正在寻找Shopify嵌入式应用程序SDK，其中有一部分你必须从服务器端变量中删除一点javascript。我使用react引擎，react-router和express.js。

<head>
  <script src="https://cdn.shopify.com/s/assets/external/app.js"></script>
  <script type="text/javascript">
    ShopifyApp.init({
      apiKey: 'YOUR_APP_API_KEY',
      shopOrigin: 'https://CURRENT_LOGGED_IN_SHOP.myshopify.com'
    });
  </script>
</head>

有一种方法可以提供red.render(req.url, data)数据，但是我不确定我应该从组件内使用它做什么。是否有从组件内部访问和更改全局ShopifyApp变量的方法?

我将shopify代码添加到App组件(react-routes中最顶部的组件)的componentDidMount中。

var Layout = require('./layout.jsx');
var React = require('react');
var Router = require('react-router');
module.exports = React.createClass({
  componentDidMount: function(){
    if(this.props.shopify){
      ShopifyApp.init({
        apiKey: this.props.shopify.apiKey,
        shopOrigin: this.props.shopify.shopOrigin
      })
    }
  },
  render: function render() {
    return (
      <Layout {...this.props}>
        <Router.RouteHandler {...this.props}/>
      </Layout>
    );
  }
});
相关文章：