如何在自定义插件Response Commerce中重写页脚

时间:2018-07-24 14:54:40

标签: reaction-commerce

现在,我正在使用Reaction Commerce 1.10。我想创建一个自定义插件并重写页脚,但不知道该怎么做。

这是页脚代码:

import React from "react";
import { registerComponent } from "/imports/plugins/core/components/lib";

const Footer = () => (
  <div className="reaction-navigation-footer footer-default">
    <nav className="navbar-bottom">
      <div className="row">
        {/* Footer content */}
      </div>
    </nav>
  </div>
);

registerComponent("Footer", Footer);

export default Footer;

1 个答案:

答案 0 :(得分:1)

您可以通过首先创建自定义插件来做到这一点:

reaction plugins create --name your-footer-plugin

然后,在components下创建一个/imports/plugins/custom/your-footer-plugin/client目录。

/imports/plugins/custom/your-footer-plugin/client/components中,创建一个Footer.jsx文件。

在此文件中,使用组件API将Footer组件替换为您想要的组件:

import React from "react";
import { replaceComponent } from "@reactioncommerce/reaction-components";

const Footer = () => (
  <footer>
    <p>This is your new, custom footer.</p>
  </footer>
);

replaceComponent("Footer", Footer);

最后,请确保您在index.js中创建一个/imports/plugins/custom/your-footer-plugin/client/components文件以导入您的组件:

import "./Footer";

index.js中另外一个/imports/plugins/custom/your-footer-plugin/client导入您的component目录的索引:

import "./components";

请确保使用reaction reset -n && reaction重新启动Response,以使这些更改生效。