如何将 mailerlite.com 注册表单与 React 集成? [英] How can I integrate a mailerlite.com signup form with React?

问题描述

Mailerlite.com 可让您在网站中嵌入电子邮件注册表单 - 如何将其与 React 集成?

Mailerlite.com lets you embed an email signup form in your site - how can you integrate this with React?

具体来说，如何集成 JavaScript 代码?

Specifically, how do you integrate the JavaScript code?

推荐答案

您可以将其调整为不使用内联生成函数来隐藏/显示表单部分.

You can adapt it to not use an inline generated function for the hiding/displaying of the form section.

您可以通过组件的状态管理显示.

You can manage the displaying with the state of you component.

class Landing extends React.Component {
  constructor(props) {
      super(props);
      this.state = {
          display_form: true,
          display_success: false,
      };

  // add mailerlite code
  componentDidMount() {
    // success function
    const f = () => {
      this.setState({
        display_form: false,
        display_success: true,
      });
    };
    // register it on the window object
    window[`ml_webform_success_${CODE}`] = f;

    const script2 = document.createElement("script");
    script2.src = "https://static.mailerlite.com/js/w/webforms.min.js?CODE";
    document.body.appendChild(script2);
  }

  render() {
    return (...);
  }
}

并且使用状态来显示或不显示部分，这个比较反应式

And use the state to display or not the part, this is more Reactish

问候，

这篇关于如何将 mailerlite.com 注册表单与 React 集成?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！