Html 在ReactJS中的格子链接上显示横幅

Html 在ReactJS中的格子链接上显示横幅,html,reactjs,plaid,Html,Reactjs,Plaid,我目前正在制作react.js中的一个网页,该网页允许用户通过plaid链接链接他们的信息。然而,由于目前并非所有提供商都可以通过plaid链接。我想在链接模块的底部显示一个横幅,可以将用户发送到一个页面,在那里他们可以手动输入信息。 我尝试过的事情: 放置在引导覆盖中 放置在引导模式弹出窗口中 放置在一个DOM门户中 当打开格子时,通过具有高z索引使HTML元素出现在上面 在引导模式中调用this.linkhandler.open()函数并响应DOM门户 如何在页面上设置格子链接: on

我目前正在制作react.js中的一个网页,该网页允许用户通过plaid链接链接他们的信息。然而,由于目前并非所有提供商都可以通过plaid链接。我想在链接模块的底部显示一个横幅,可以将用户发送到一个页面,在那里他们可以手动输入信息。

我尝试过的事情:

  • 放置在引导覆盖中
  • 放置在引导模式弹出窗口中
  • 放置在一个DOM门户中
  • 当打开格子时,通过具有高z索引使HTML元素出现在上面
  • 在引导模式中调用
    this.linkhandler.open()
    函数并响应DOM门户
如何在页面上设置格子链接:

onScriptLoaded(){
   this.linkHandler = window.Plaid.Create({
      apiVersion:"v2",
      clientName: clientName,
      countryCodes: this.state.countryCodes,
      env: environment,
      key: key,
      onExit: this.handleOnExit,
      onLoad: this.handleLinkOnLoad,
      onSuccess: this.handleOnSuccess,
      product: this.state.products,
      selectAccount: false,
      token: this.state.token,
      webhook:this.state.webhook,
      accountSubtypes:this.state.subtypes,
   });
   this.setState({disabledButton:false});
}

handleLinkOnLoad() {
   this.setState({ linkLoaded: true });
}

handleOnClick(event) {
   if (this.linkHandler) {
      this.linkHandler.open();
      this.setState({linkOpened:true});
   }
}

handleOnExit() {
    // handles exit
}

handleOnSuccess() {
   // handles Success
}

render() {
   return(
      <div>
         <Button onClick={this.handleOnClick} disabled={this.state.disabledButton}>
            link your info
         </Button>
         <Script
              url="https://cdn.plaid.com/link/v2/stable/link-initialize.js"
              onError={this.onScriptError}
              onLoad={this.onScriptLoaded}>
          </Script>
      </div>
   )

}
onScriptLoaded(){
this.linkHandler=window.Plaid.Create({
apiVersion:“v2”,
clientName:clientName,
countryCodes:this.state.countryCodes,
环境:,
钥匙:钥匙,
onExit:这是一个出口,
onLoad:this.handleLinkOnLoad,
成功:这是成功,
产品:本州产品,
selectAccount:false,
令牌:this.state.token,
webhook:this.state.webhook,
accountSubtypes:this.state.subtypes,
});
this.setState({disabledButton:false});
}
handleLinkOnLoad(){
this.setState({linkload:true});
}
点击(事件){
if(this.linkHandler){
this.linkHandler.open();
this.setState({linkOpened:true});
}
}
handleOnExit(){
//手柄出口
}
成功{
//成功
}
render(){
返回(
链接您的信息
)
}
注意,虽然这是以与
react plaid link
模块相同的方式实现的,但我没有在此页面中导入模块,因为它当前不支持我需要的
accountSubtypes
参数