如何将事件处理程序添加到第三方表单组件中的按钮

时间:2019-07-23 14:42:54

标签: reactjs google-analytics gatsby hubspot

我有一个使用少数插件和第三方组件的Gatsby网站。有问题的组件是使用react-hubspot-form构建的表单。 Hubspot发送原始HTML,我可以使用CSS设置样式。我对此有两个潜在的困扰,这两个都涉及针对该形式的特定元素。

我希望将Google Analytics(分析)添加到“提交”按钮中以跟踪点击。我已经考虑过包装组件并向父级添加onClick,但这将跟踪表单上任何地方的点击,而不仅仅是提交按钮。我目前正在尝试合并ReactGA。

第二个问题是用户选择单选按钮时更新状态。我需要根据用户选择的单选按钮来动态更新url,并且目前无法弄清楚该怎么做。

<HubspotForm
   portalId='PORTAL_ID'
   formId='FORM_ID'
   redirectUrl={`URL_WITH_PROPS_TO_DYNAMICALLY_UPDATE_LENDER_CODE=${props.lenderCode}`}
   submitButtonClass='loanAppSubmitBtn'
   cssClass='program-apply'
   onSubmit={()=>{
             ReactGA.event({
                 category: 'Apply Now Button',
                 action: 'click',
                 label: 'form submission'
             })
     console.log("clicked hidden button")
   }}
/>

当我尝试为onSubmit放置一个函数时,控制台说我需要使用jQuery。

0 个答案:

没有答案