javascript - 实现深层链接 url 导致 react 原生应用程序无法打开 android

Question

我正在尝试实现到我的 react native 应用程序的深层链接。
问题当我的应用程序处于后台时尝试打开链接时出现错误错误是

undefined is not an object (evaluating 'this.props')

如果我的应用程序不在后台(应用程序未运行)，它工作正常
我的初始路由是应用程序在重定向到特定路由之前显示大约 2.5 秒的闪屏，具体取决于用户是否登录，如果用户登录则重定向到主路由，否则重定向到登录路由。
这是我的应用路线

function mapStateToProps (state) {
  return {
    deviceVersion: state.device.version,
    auth: {
      form: {
        isFetching: state.auth.form.isFetching
      }
    },
    global: state.global,
    search: state.search
  }
}


function mapDispatchToProps (dispatch) {
  return {
    actions: bindActionCreators({ ...authActions, ...deviceActions, ...globalActions, ...searchActions }, dispatch)
  }
}

var reactMixin = require('react-mixin')
import TimerMixin from 'react-timer-mixin'

我的 componentDidMount 函数

componentDidMount () {
            this.setTimeout(
                    () => {
                      this.props.actions.getSessionToken()
                      this.props.actions.setHeight(height)
                      this.props.actions.getIp()
                      this.props.actions.getUniqueId()
                      this.props.actions.getLanguage()
                    },
                    2500
                )

渲染功能

render () {
    return (
      <View style={styles.container}>
        <StatusBar
          backgroundColor="#b33939"
        />
        <View style={{flex:1}}>
        <Header isFetching={this.props.auth.form.isFetching}
          showState={this.props.global.showState}
          currentState={this.props.global.currentState}
          onGetState={this.props.actions.getState}
          onSetState={this.props.actions.setState} />
        </View>

        <View style={{flex:1}}>
          <Text style={styles.summary}>Welcome</Text>
        </View>

      </View>
    )
  }
}

reactMixin(App.prototype, TimerMixin)

export default connect(mapStateToProps, mapDispatchToProps)(App)

当我实现 Deeplink 时，我将 Linking Listener 添加到我的 componentDidMount 函数以处理 url，并将超时内的一些操作移动到 handleOpenURL 函数

componentDidMount () {
    Linking.getInitialURL()
            .then(url => this.handleOpenURL({ url }))
            .catch(console.error);

    Linking.addEventListener('url', this.handleOpenURL);
  }

handleOpenURL 函数看起来像这样

handleOpenURL(event) {
    console.log('URL', event)

    if(!_.isNull(event.url))
    {
      var url = event.url
      var removeDomain = url.replace("https://www.example.com/", "")
      console.log(removeDomain)
      var lastChar = removeDomain[removeDomain.length -1];
      if(lastChar != '/')
      {
        var data = removeDomain.split("/")
        if(data[0] == 'listing')
        {
          this.props.actions.openListingDetail(data[1], null)
        }
        
      }
    }else{
      this.setTimeout(
            () => {
              this.props.actions.getSessionToken()
              this.props.actions.setHeight(height)
              this.props.actions.getIpAdd()
              this.props.actions.getUniqueId()
              this.props.actions.getLanguage()
            },
            2500
        )
    }
  }

getSessionToken 函数是检查用户是否登录。
我正在使用 react 路由器通量
如果应用程序当前未运行，这可以正常工作。 Url 正确打开列表路由。
如果在没有深层链接 url 的情况下正常打开，这也可以正常工作。
但是当应用程序在后台时出现错误，它无法执行 this.props.actions.openListingDetail(data[1], null)错误信息

undefined is not an object (evaluating 'this.props')

android:launchMode="singleTask"

知道有什么问题吗？

Answer 1

看来您正在将方法作为静态函数传递给 addEventListener .你可以试试这个:

componentDidMount () {
  Linking.getInitialURL()
    .then(url => this.handleOpenURL({ url }))
    .catch(console.error);

  Linking.addEventListener('url', () => this.handleOpenURL());
}

希望这可以帮助。