javascript - NavBar React-Native 中的文本
问题描述
我发现导航栏中的文本有问题。
我使用路由器通量。
我的问题是我在导航栏的右侧插入了注销,但我只会在用户类别中显示此按钮。
因此,如果您的角色是“user1”:您可以注销。
如果您的角色是“user2”:您无法注销,也不应该看到“注销”文本。
这是我用来显示注销按钮的代码:
应用程序.js
export default class App extends Component {
static redirectLogout() {
Alert.alert("Logout", "Logout effettuato con successo");
Actions.authentication();
}
static logout() {
Utente.clearUtenteLoggato();
App.redirectLogout();
}
<Scene
key="homepageutente"
component={HomepageUtente}
type="reset"
leftTitle="Home"
leftButtonTextStyle={{color: "#ffffff"}}
onLeft={() => Actions.authentication()}
rightButtonTextStyle={{color: "#ffffff"}}
rightTitle="Logout"
onRight={() => App.logout()}
navigationBarStyle={{ backgroundColor: "#64c7c0" }}
/>
你知道我该怎么做吗?如果需要更多信息,我会立即提供。非常感谢
编辑:这是应用程序的结构:
第一页:
身份验证:(你可以去)
--> LoginConsumer
-->登录加号
我使用单击一个按钮后加载的白页来检查您是否已登录以及您是哪种用户。
启动.js
class Starting extends Component {
constructor(props) {
super(props);
this.state = {
loading: true
};
}
componentWillMount() {
Utente.getUtenteLoggato()
.then(dataUtenteLoggato => {
if (dataUtenteLoggato !== null) {
global.utente = new Utente(JSON.parse(dataUtenteLoggato));
Actions.homepageutente()({type: 'reset'});
} else if(Roles == "ROLE_PLUS") { // But this doesn't work :(
console.log(Roles)
Actions.loginplus();
}
else {
Actions.loginconsumer()
}
})
.catch(err => {
console.log(err);
})
.finally(() => {
this.setState({ loading: false });
});
}
因此,如果您是 Role_Plus,则无法注销。
Starting.js 从 Utente 调用“getUtenteLoggato”:
static async getUtenteLoggato() {
try {
return await AsyncStorage.getItem("@UtenteLoggato");
} catch (error) {
console.log(error.message);
return null;
}
}
解决方案
您可以使用简单的三元条件通过检查 user1 状态来确定其状态:
<Scene
key="homepageutente"
component={HomepageUtente}
type="reset"
leftTitle="Home"
leftButtonTextStyle={{color: "#ffffff"}}
onLeft={() => Actions.authentication()}
rightButtonTextStyle={{color: "#ffffff"}}
rightTitle={user === "user1" ? "Logout" : ""}
onRight={user === "user1" ? () => App.logout() : () => {}}
navigationBarStyle={{ backgroundColor: "#64c7c0" }}
/>
推荐阅读
- hash - 为什么交易哈希比特币数百万价值 txid
- c++ - 如何在 C++ 中调用使用部分模板参数包的函数?
- reactjs - reactjs中componentName.test.js文件的用途是什么
- r - R - 通过第一点的线性回归 - 为什么我的直觉是错误的?
- flutter - 使用 GraphQL 订阅调整颤振视图的大小会导致请求垃圾邮件
- python - 曲线拟合类余弦数据
- reporting-services - 在 SQL Server 报表服务器目录中查找哪些报表使用了哪些数据集
- python - 如何在给定超时的kafka中查找消息
- vue.js - 如何在 vuejs 中获取特定的数组值
- python - 索引列表元素