问题
由 JSX 编写的 React 组件,下面4个定义中正确的是哪些?
选项
A React 官方强制要求使用 JSX;
B 组件除了名称必填,属性和子集都是可选定义;
C 嵌套定义时,单个子集不用放在数组中;
D 使用 React.createElement 方法时组件只支持 React.Component
的子类或者普通函数,不支持字符串;
答案
B
解答
JSX的解析是通过 React.createElement(component, props, ...children) 语法。因此,使用 JSX 可以完成的任何事情都可以通过纯 JavaScript 完成。
官方的例子非常好的说明一点,用 JSX 编写的代码:
class Hello extends React.Component { render() { return <div>Hello {this.props.toWhat}</div>; } } ReactDOM.render( <Hello toWhat="World" />, document.getElementById('root') );
可以编写为不使用 JSX 的代码:
class Hello extends React.Component { render() { return React.createElement('div', null, `Hello ${this.props.toWhat}`); } } ReactDOM.render( React.createElement(Hello, {toWhat: 'World'}, null), document.getElementById('root') );
因此我们可以得出 React 组件的定义规则:
-
名称定义,标签字符串或组件对象名称,且标签支持CSS选择器的方式赋值属性;
-
属性定义,以对象方式描述元素的所有属性信息;
-
子集定义,子集仅支持字符串、数组方式的嵌套定义;
-
容器规则,嵌套定义时必须以数组方式,存在于一个容器元素下面;
参考资料
来源
《考试竞技》微信小程序