how to a call static function (eg: static navigationOptions) from another function in react native
how can i call a static function (static navigationOptions
) from any other function in react native?
It fails when using the this
keyword, but is it possible to render static navigationOptions
again by calling it?
react-native
add a comment |
how can i call a static function (static navigationOptions
) from any other function in react native?
It fails when using the this
keyword, but is it possible to render static navigationOptions
again by calling it?
react-native
1
Please add your trial as code (i.e. separated by a blank line, indented with 4 positions).
– Dirk Horsten
Nov 21 '18 at 11:03
What is your intent? why are you trying to call navigationOptions? Are you trying to pass any params or are you trying to add navigation bar button to the left or right? Kindly include the code which you have used.
– Manju Basha
Nov 21 '18 at 11:44
@ManjuBasha i think that navigationOptions function is called once when the page loads. I have an conditional headerLeft property inside navigationOptions and it is based on a state param.
– Fahad
Nov 22 '18 at 4:00
add a comment |
how can i call a static function (static navigationOptions
) from any other function in react native?
It fails when using the this
keyword, but is it possible to render static navigationOptions
again by calling it?
react-native
how can i call a static function (static navigationOptions
) from any other function in react native?
It fails when using the this
keyword, but is it possible to render static navigationOptions
again by calling it?
react-native
react-native
edited Nov 21 '18 at 15:40
Graham
3,543123559
3,543123559
asked Nov 21 '18 at 10:33
FahadFahad
168
168
1
Please add your trial as code (i.e. separated by a blank line, indented with 4 positions).
– Dirk Horsten
Nov 21 '18 at 11:03
What is your intent? why are you trying to call navigationOptions? Are you trying to pass any params or are you trying to add navigation bar button to the left or right? Kindly include the code which you have used.
– Manju Basha
Nov 21 '18 at 11:44
@ManjuBasha i think that navigationOptions function is called once when the page loads. I have an conditional headerLeft property inside navigationOptions and it is based on a state param.
– Fahad
Nov 22 '18 at 4:00
add a comment |
1
Please add your trial as code (i.e. separated by a blank line, indented with 4 positions).
– Dirk Horsten
Nov 21 '18 at 11:03
What is your intent? why are you trying to call navigationOptions? Are you trying to pass any params or are you trying to add navigation bar button to the left or right? Kindly include the code which you have used.
– Manju Basha
Nov 21 '18 at 11:44
@ManjuBasha i think that navigationOptions function is called once when the page loads. I have an conditional headerLeft property inside navigationOptions and it is based on a state param.
– Fahad
Nov 22 '18 at 4:00
1
1
Please add your trial as code (i.e. separated by a blank line, indented with 4 positions).
– Dirk Horsten
Nov 21 '18 at 11:03
Please add your trial as code (i.e. separated by a blank line, indented with 4 positions).
– Dirk Horsten
Nov 21 '18 at 11:03
What is your intent? why are you trying to call navigationOptions? Are you trying to pass any params or are you trying to add navigation bar button to the left or right? Kindly include the code which you have used.
– Manju Basha
Nov 21 '18 at 11:44
What is your intent? why are you trying to call navigationOptions? Are you trying to pass any params or are you trying to add navigation bar button to the left or right? Kindly include the code which you have used.
– Manju Basha
Nov 21 '18 at 11:44
@ManjuBasha i think that navigationOptions function is called once when the page loads. I have an conditional headerLeft property inside navigationOptions and it is based on a state param.
– Fahad
Nov 22 '18 at 4:00
@ManjuBasha i think that navigationOptions function is called once when the page loads. I have an conditional headerLeft property inside navigationOptions and it is based on a state param.
– Fahad
Nov 22 '18 at 4:00
add a comment |
2 Answers
2
active
oldest
votes
If you want to change navigation options dynamically, try like this
static navigationOptions = ({ navigation }) => {
return {
title: navigation.getParam('otherParam', 'A Nested Details Screen'),
};
};
this.props.navigation.setParams({otherParam: 'Updated!'})
Another method
static navigationOptions = ({ navigation }) => {
const {state} = navigation;
return {
title: `${state.params.title}`,
};
};
ChangeThisTitle = (titleText) => {
const {setParams} = this.props.navigation;
setParams({ title: titleText })
}
call this.ChangeThisTitle('your title')
wherever you want
add a comment |
They only way to achieve it is using navigation params. So set your headerleft property flag or value using setParams. That will solve the issue. Below mentioned code should be used in your class.
static navigationOptions = ({ navigation }) => {
const { params = {} } = navigation.state;
let buttonView =
<TouchableOpacity style={navItemStyle} activeOpacity={0.7} onPress={() => { params.logoutClick() }}>
<Text style={navItemTxt}> Logout</Text>
</TouchableOpacity >
return {
title: 'Home',
headerLeft: params.showHeaderLeft && buttonView
};
};
componentDidMount() {
this.props.navigation.setParams({
showHeaderLeft: this.props.headerFlag,
//headerFlag used above is your value and showHeaderLeft is the name of the param
});
}
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53410151%2fhow-to-a-call-static-function-eg-static-navigationoptions-from-another-functi%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
If you want to change navigation options dynamically, try like this
static navigationOptions = ({ navigation }) => {
return {
title: navigation.getParam('otherParam', 'A Nested Details Screen'),
};
};
this.props.navigation.setParams({otherParam: 'Updated!'})
Another method
static navigationOptions = ({ navigation }) => {
const {state} = navigation;
return {
title: `${state.params.title}`,
};
};
ChangeThisTitle = (titleText) => {
const {setParams} = this.props.navigation;
setParams({ title: titleText })
}
call this.ChangeThisTitle('your title')
wherever you want
add a comment |
If you want to change navigation options dynamically, try like this
static navigationOptions = ({ navigation }) => {
return {
title: navigation.getParam('otherParam', 'A Nested Details Screen'),
};
};
this.props.navigation.setParams({otherParam: 'Updated!'})
Another method
static navigationOptions = ({ navigation }) => {
const {state} = navigation;
return {
title: `${state.params.title}`,
};
};
ChangeThisTitle = (titleText) => {
const {setParams} = this.props.navigation;
setParams({ title: titleText })
}
call this.ChangeThisTitle('your title')
wherever you want
add a comment |
If you want to change navigation options dynamically, try like this
static navigationOptions = ({ navigation }) => {
return {
title: navigation.getParam('otherParam', 'A Nested Details Screen'),
};
};
this.props.navigation.setParams({otherParam: 'Updated!'})
Another method
static navigationOptions = ({ navigation }) => {
const {state} = navigation;
return {
title: `${state.params.title}`,
};
};
ChangeThisTitle = (titleText) => {
const {setParams} = this.props.navigation;
setParams({ title: titleText })
}
call this.ChangeThisTitle('your title')
wherever you want
If you want to change navigation options dynamically, try like this
static navigationOptions = ({ navigation }) => {
return {
title: navigation.getParam('otherParam', 'A Nested Details Screen'),
};
};
this.props.navigation.setParams({otherParam: 'Updated!'})
Another method
static navigationOptions = ({ navigation }) => {
const {state} = navigation;
return {
title: `${state.params.title}`,
};
};
ChangeThisTitle = (titleText) => {
const {setParams} = this.props.navigation;
setParams({ title: titleText })
}
call this.ChangeThisTitle('your title')
wherever you want
answered Nov 21 '18 at 11:46
AshaAsha
2081316
2081316
add a comment |
add a comment |
They only way to achieve it is using navigation params. So set your headerleft property flag or value using setParams. That will solve the issue. Below mentioned code should be used in your class.
static navigationOptions = ({ navigation }) => {
const { params = {} } = navigation.state;
let buttonView =
<TouchableOpacity style={navItemStyle} activeOpacity={0.7} onPress={() => { params.logoutClick() }}>
<Text style={navItemTxt}> Logout</Text>
</TouchableOpacity >
return {
title: 'Home',
headerLeft: params.showHeaderLeft && buttonView
};
};
componentDidMount() {
this.props.navigation.setParams({
showHeaderLeft: this.props.headerFlag,
//headerFlag used above is your value and showHeaderLeft is the name of the param
});
}
add a comment |
They only way to achieve it is using navigation params. So set your headerleft property flag or value using setParams. That will solve the issue. Below mentioned code should be used in your class.
static navigationOptions = ({ navigation }) => {
const { params = {} } = navigation.state;
let buttonView =
<TouchableOpacity style={navItemStyle} activeOpacity={0.7} onPress={() => { params.logoutClick() }}>
<Text style={navItemTxt}> Logout</Text>
</TouchableOpacity >
return {
title: 'Home',
headerLeft: params.showHeaderLeft && buttonView
};
};
componentDidMount() {
this.props.navigation.setParams({
showHeaderLeft: this.props.headerFlag,
//headerFlag used above is your value and showHeaderLeft is the name of the param
});
}
add a comment |
They only way to achieve it is using navigation params. So set your headerleft property flag or value using setParams. That will solve the issue. Below mentioned code should be used in your class.
static navigationOptions = ({ navigation }) => {
const { params = {} } = navigation.state;
let buttonView =
<TouchableOpacity style={navItemStyle} activeOpacity={0.7} onPress={() => { params.logoutClick() }}>
<Text style={navItemTxt}> Logout</Text>
</TouchableOpacity >
return {
title: 'Home',
headerLeft: params.showHeaderLeft && buttonView
};
};
componentDidMount() {
this.props.navigation.setParams({
showHeaderLeft: this.props.headerFlag,
//headerFlag used above is your value and showHeaderLeft is the name of the param
});
}
They only way to achieve it is using navigation params. So set your headerleft property flag or value using setParams. That will solve the issue. Below mentioned code should be used in your class.
static navigationOptions = ({ navigation }) => {
const { params = {} } = navigation.state;
let buttonView =
<TouchableOpacity style={navItemStyle} activeOpacity={0.7} onPress={() => { params.logoutClick() }}>
<Text style={navItemTxt}> Logout</Text>
</TouchableOpacity >
return {
title: 'Home',
headerLeft: params.showHeaderLeft && buttonView
};
};
componentDidMount() {
this.props.navigation.setParams({
showHeaderLeft: this.props.headerFlag,
//headerFlag used above is your value and showHeaderLeft is the name of the param
});
}
answered Nov 22 '18 at 11:33
Manju BashaManju Basha
312419
312419
add a comment |
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53410151%2fhow-to-a-call-static-function-eg-static-navigationoptions-from-another-functi%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
1
Please add your trial as code (i.e. separated by a blank line, indented with 4 positions).
– Dirk Horsten
Nov 21 '18 at 11:03
What is your intent? why are you trying to call navigationOptions? Are you trying to pass any params or are you trying to add navigation bar button to the left or right? Kindly include the code which you have used.
– Manju Basha
Nov 21 '18 at 11:44
@ManjuBasha i think that navigationOptions function is called once when the page loads. I have an conditional headerLeft property inside navigationOptions and it is based on a state param.
– Fahad
Nov 22 '18 at 4:00