const User = () => { return ( <div className="content-inner"> <UserFilter {...userFilterProps} /> <UserList {...userListProps} /> <UserModalGen /> </div> ) }
在React的设定中,初始化完props后,props是不可变的。
var props = { foo: x,bar: y }; var component = <Component { ...props } />;以上代码和下面代码完全相同
var component = <Component foo={x} bar={y} />
当需要拓展我们的属性的时候,定义个一个属性对象,并通过 {…props} 的方式引入,在JSX中,可以使用
...
运算符,表示将一个对象的键值对与
ReactElement
的
props
属性合并,这个
运算符的实现类似于ES6 Array中的
运算符的特性。,React会帮我们拷贝到组件的props属性中。重要的是—这个过程是由React操控的,不是手动添赋值的属性。
它也可以和普通的XML属性混合使用,需要同名属性,后者将覆盖前者:
var props = { foo: 'default' };
var component = <Component {...props} foo={'override'} />;
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。