react native :有办法检测它是否是第一次启动应用程序?
react native : There is way to detect if it is the first time launch of the app or not?
有什么方法可以检测应用是不是第一次启动?
仅当它是 不是 第一次打开该应用程序时 return 仅 “AppNavigator” 否则 return一切 。
这是我的示例代码:
如何在我的代码中使用 AsyncStorage 示例?
///////// AsyncStorage/////////////
async componentDidMount() {
const firstTime = await AsyncStorage.getItem("isFirstTime")
if(firstTime != null) {
// It is not first time use
} else {
// It is first time
await AsyncStorage.setItem("isFirstTime", 'true')
}
}
/////////////// My code //////////////
export default class App extends React.Component {
constructor(props) {
super(props);
this.state = {
azureLoginObject: {},
loginSuccess: false,
};
this.azureInstance = new AzureInstance(credentials);
this._onLoginSuccess = this._onLoginSuccess.bind(this);
}
_onLoginSuccess() {
this.azureInstance
.getUserInfo()
.then((result) => {
this.setState({
loginSuccess: true,
azureLoginObject: result,
});
console.log(result);
//HERE EXAMPLE FOR STORE SOME VARIABLE INTO MY REDUX STORE
store.dispatch(userPrincipalName(result.userPrincipalName));
store.dispatch(givenName(result.mobilePhone));
})
.catch((err) => {
console.log(err);
});
}
render() {
if (!this.state.loginSuccess) {
return (
<Provider store={store}>
<AzureLoginView
azureInstance={this.azureInstance}
loadingMessage="Requesting access token"
onSuccess={this._onLoginSuccess}
/>
</Provider>
);
}
const { userPrincipalName, givenName } = this.state.azureLoginObject;
return (
<Provider store={store}>
<AppNavigator />
</Provider>
);
}
}
您可以使用 asyncStorage
:
async componentDidMount() {
const firstTime = await AsyncStorage.getItem("isFirstTime")
if(firstTime != null) {
// It is not first time use
} else {
// It is first time
await AsyncStorage.setItem("isFirstTime", 'true')
}
}
根据其他答案,您必须使用异步存储来检查 Componentdidmount 上的值,如果不存在则设置该值。
此外,其余的逻辑也必须稍作更改。
在这里,我们显示 ActivityIndicator 直到检查完成,之后您可以做任何您想做的事情。
我无法测试此代码,因为它具有依赖性,但我添加了一些内联注释,以便您可以进行适当的更改。
import { ActivityIndicator } from "react-native";
export default class App extends React.Component {
constructor(props) {
super(props);
this.state = {
azureLoginObject: {},
loginSuccess: false,
loading: true
};
}
async componentDidMount() {
const firstTime = await AsyncStorage.getItem("isFirstTime")
if (firstTime != null) {
this.setState({ loading: false });
//Place this based on your logic
this.azureInstance = new AzureInstance(credentials);
this._onLoginSuccess = this._onLoginSuccess.bind(this);
} else {
// It is first time
await AsyncStorage.setItem("isFirstTime", 'true');
this.setState({ loading: false })
}
}
_onLoginSuccess() {
this.azureInstance
.getUserInfo()
.then((result) => {
this.setState({
loginSuccess: true,
azureLoginObject: result,
});
console.log(result);
//HERE EXAMPLE FOR STORE SOME VARIABLE INTO MY REDUX STORE
store.dispatch(userPrincipalName(result.userPrincipalName));
store.dispatch(givenName(result.mobilePhone));
})
.catch((err) => {
console.log(err);
});
}
render() {
//Show activity indicator until async storage check is done
if (this.state.loading)
return <ActivityIndicator />;
if (!this.state.loginSuccess) {
return (
<Provider store={store}>
<AzureLoginView
azureInstance={this.azureInstance}
loadingMessage="Requesting access token"
onSuccess={this._onLoginSuccess}
/>
</Provider>
);
}
const { userPrincipalName, givenName } = this.state.azureLoginObject;
return (
<Provider store={store}>
<AppNavigator />
</Provider>
);
}
}
有什么方法可以检测应用是不是第一次启动? 仅当它是 不是 第一次打开该应用程序时 return 仅 “AppNavigator” 否则 return一切 。 这是我的示例代码: 如何在我的代码中使用 AsyncStorage 示例?
///////// AsyncStorage/////////////
async componentDidMount() {
const firstTime = await AsyncStorage.getItem("isFirstTime")
if(firstTime != null) {
// It is not first time use
} else {
// It is first time
await AsyncStorage.setItem("isFirstTime", 'true')
}
}
/////////////// My code //////////////
export default class App extends React.Component {
constructor(props) {
super(props);
this.state = {
azureLoginObject: {},
loginSuccess: false,
};
this.azureInstance = new AzureInstance(credentials);
this._onLoginSuccess = this._onLoginSuccess.bind(this);
}
_onLoginSuccess() {
this.azureInstance
.getUserInfo()
.then((result) => {
this.setState({
loginSuccess: true,
azureLoginObject: result,
});
console.log(result);
//HERE EXAMPLE FOR STORE SOME VARIABLE INTO MY REDUX STORE
store.dispatch(userPrincipalName(result.userPrincipalName));
store.dispatch(givenName(result.mobilePhone));
})
.catch((err) => {
console.log(err);
});
}
render() {
if (!this.state.loginSuccess) {
return (
<Provider store={store}>
<AzureLoginView
azureInstance={this.azureInstance}
loadingMessage="Requesting access token"
onSuccess={this._onLoginSuccess}
/>
</Provider>
);
}
const { userPrincipalName, givenName } = this.state.azureLoginObject;
return (
<Provider store={store}>
<AppNavigator />
</Provider>
);
}
}
您可以使用 asyncStorage
:
async componentDidMount() {
const firstTime = await AsyncStorage.getItem("isFirstTime")
if(firstTime != null) {
// It is not first time use
} else {
// It is first time
await AsyncStorage.setItem("isFirstTime", 'true')
}
}
根据其他答案,您必须使用异步存储来检查 Componentdidmount 上的值,如果不存在则设置该值。
此外,其余的逻辑也必须稍作更改。 在这里,我们显示 ActivityIndicator 直到检查完成,之后您可以做任何您想做的事情。 我无法测试此代码,因为它具有依赖性,但我添加了一些内联注释,以便您可以进行适当的更改。
import { ActivityIndicator } from "react-native";
export default class App extends React.Component {
constructor(props) {
super(props);
this.state = {
azureLoginObject: {},
loginSuccess: false,
loading: true
};
}
async componentDidMount() {
const firstTime = await AsyncStorage.getItem("isFirstTime")
if (firstTime != null) {
this.setState({ loading: false });
//Place this based on your logic
this.azureInstance = new AzureInstance(credentials);
this._onLoginSuccess = this._onLoginSuccess.bind(this);
} else {
// It is first time
await AsyncStorage.setItem("isFirstTime", 'true');
this.setState({ loading: false })
}
}
_onLoginSuccess() {
this.azureInstance
.getUserInfo()
.then((result) => {
this.setState({
loginSuccess: true,
azureLoginObject: result,
});
console.log(result);
//HERE EXAMPLE FOR STORE SOME VARIABLE INTO MY REDUX STORE
store.dispatch(userPrincipalName(result.userPrincipalName));
store.dispatch(givenName(result.mobilePhone));
})
.catch((err) => {
console.log(err);
});
}
render() {
//Show activity indicator until async storage check is done
if (this.state.loading)
return <ActivityIndicator />;
if (!this.state.loginSuccess) {
return (
<Provider store={store}>
<AzureLoginView
azureInstance={this.azureInstance}
loadingMessage="Requesting access token"
onSuccess={this._onLoginSuccess}
/>
</Provider>
);
}
const { userPrincipalName, givenName } = this.state.azureLoginObject;
return (
<Provider store={store}>
<AppNavigator />
</Provider>
);
}
}