具有反应路线的三元运算符中的多个表达式

Question

嘿，我想在我的路线上设置一个会话项目，这样我就可以在我的身份验证回调中使用它。所以这里我有一个三元运算符，我检查它是否经过身份验证然后我做一些事情，如果没有我做两件事。

它不起作用。我的问题是如何对三元运算符做多项操作，无论它是真还是假。

<Route path="/dashboard" render={(props) => (
          auth.isAuthenticated() ? (
              <whateverComp auth={auth} {...props} />
          ) : (
              <Redirect to="/log-in"/>
          ) ? // setter for page_name
              sessionStorage.setItem('page_name', 'dashboard'): null
      )}/>

我的解决方案：

<Route path="/dashboard" render={(props) => {
        if (!auth.isAuthenticated()) {
          sessionStorage.setItem('page_name', 'dashboard');
          return <Redirect to="/log-in"/>;
        }
        else {
          return <Dashboard auth={auth} {...props} />;
        }
      }}/>

Answer 1

具体来说，问题是三元运算符解析为某种东西，然后由三元左边上的任何东西求值。

例如

const x = condition
          ? result1
          : result2;

但是如果三元组的左边什么都没有，它除了副作用什么都不做，if 语句可以更清楚地做到这一点。（如果您的代码比单行代码更复杂，您可能还应该使用 if/else）

也许你想要

if (!auth.isAuthenticated()) return (
  <whateverComp auth={auth} {...props} />
);
sessionStorage.setItem('page_name', 'dashboard');
return (
  <Redirect to="/log-in"/>
);

Answer 2

choreDoor === 0 ? 
   (openDoor1 = botDoorPath,
    openDoor2 = beachDoorPath,
    openDoor3 = spaceDoorPath)
: choreDoor === 1 ? 
   (openDoor2 = botDoorPath,
    openDoor1 = beachDoorPath, 
    openDoor3 = spaceDoorPath) 
: choreDoor === 2 ?
   (openDoor3 = botDoorPath,
    openDoor1 = beachDoorPath, 
    openDoor2 = spaceDoorPath)
: false;

解决了我的问题

具有反应路线的三元运算符中的多个表达式

multiple expressions in ternary operator with react route

javascript

session-storage

reactjs