使用memory leakage
时遇到react-plaid-link-module
问题。我无法通过unsubscribe
方法componentWillUnmount
来使用它。尝试了不同的方法,仍然收到此错误。请帮助我。
错误:
Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in the componentWillUnmount method.
in PlaidLink (at Dashboard.js:63)
in div (at Dashboard.js:61)
代码:
import React, { Component } from 'react';
import firebase from 'firebase';
import { db } from './../../config';
import PlaidLink from 'react-plaid-link';
export default class Dashboard extends Component {
unsubscribeUserAuthStateChangedListener = null;
dbListener1 = null;
dbListener2 = null;
mounted = false;
constructor(props) {
this.state = {};
this.handleOnSuccess = this.handleOnSuccess.bind(this);
}
async componentDidMount() {
this.mounted = true;
let { currentUser } = firebase.auth();
this.unsubscribeUserAuthStateChangedListener = await firebase.auth().onAuthStateChanged(
function(user) {
const dbRef = 'users/' + currentUser.uid;
this.setState({ uid: currentUser.uid, dbRef });
this.dbListener1 = db.ref(dbRef).on('value', snapshot => {
let data = snapshot.val();
if (data && this.mounted) {
this.setState({ data });
}
});
}.bind(this)
);
}
componentWillUnmount() {
if (this.unsubscribeUserAuthStateChangedListener) {
this.unsubscribeUserAuthStateChangedListener();
}
db.ref(this.state.dbRef).off('value', this.dbListener1);
this.dbListener1 = null;
this.mounted = false;
}
handleOnSuccess(token, metaData) {
if (this.state.uid && metaData) {
const newPublicToken = {
link_session_id: metaData.link_session_id,
public_token: metaData.public_token,
institution: metaData.institution,
timestamp: Date.now(),
};
}
}
handleOnExit(e) {}
render() {
return (
<div>
{this.mounted ? (
<PlaidLink
clientName="Demo"
env="sandbox"
product={['transactions']}
publicKey="59709e0d9510b4b4dacc7568932145"
selectAccount={true}
onExit={this.handleOnExit}
onSuccess={this.handleOnSuccess}
></PlaidLink>
) : (
''
)}
</div>
);
}
}