Back

reactnative - 11. JSX快速入门

发布时间: 2018-12-23 03:22:00

参考:  https://react.docschina.org/docs/introducing-jsx.html

1. 只有一个 根root element

2 使用 {} 来表示变量

<View> {user.id } </View>

3. 本质: XML代码会被babel 编译成JS代码,例如:

const element = (
  <h1 className="greeting">
    Hello, world!
  </h1>
);
等同于:
const element = React.createElement(
  'h1',
  {className: 'greeting'},
  'Hello, world!'
);

4. 可以在 {} 内写任意的 expression: 

  return (
    <div>
      {isLoggedIn ? (
        <LogoutButton onClick={this.handleLogoutClick} />
      ) : (
        <LoginButton onClick={this.handleLoginClick} />
      )}
    </div>
  );

Back