ReactJS 中的“...道具”是什么意思？

Question

什么意思……道具？代码是：

export default class NavItem extends React.Component {
constructor() {
    super();
}

render() {
    const { router, index, to, children, ...props } = this.props;
    let isActive = false;

    if (router.isActive('./', true) && index) {
        isActive = true

children我想那是实际元素的孩子，但这...props是什么意思？

谢谢你。

Answer 1

...在此上下文中使用的称为“其余”参数，如“其余部分”

这一行使用对象解构赋值语法从对象中分配this.props新变量router、index、to和children以及其他所有变量（其余的）this.props到props

const { router, index, to, children, ...props } = this.props;

这是它用法的另一个示例：

const bigBird = {height: 'tall', color: 'yellow', disposition: 'sunny'};
const {height, ...others} = bigBird;
//height == 'tall'
//others == {color: 'yellow', disposition: 'sunny'};