时间戳

首页 > 解决方案 > 当孩子也经过时，道具看起来像未定义

javascript - 当孩子也经过时，道具看起来像未定义

问题描述

我尝试将一个childrenand传递props给我的组件，孩子们通过得很好，但是道具就像未定义一样，我不知道为什么。当我不使用孩子时，这很好。一个小片段来理解这个问题。 the function

import React from "react";

export function PropsChildren({ children }, props) {
  console.log("info props", props.name, props.age);
  return (
    <div>
      <p>Props name is {props.name}</p>
      <p>Props age is {props.age}</p>
    </div>
  );
}

the call

import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
//import App from './App';
import reportWebVitals from "./reportWebVitals";
import { PropsChildren } from "./props/props_children";

ReactDOM.render(
  <React.StrictMode>
    <PropsChildren name="Knupel" age={46}>
      {document}
    </PropsChildren>
  </React.StrictMode>,
  document.getElementById("root")
);

控制台返回 info props undefined undefined

标签： javascriptreactjsreact-props

解决方案

props不是第二个论点。道具并呈现第一个对象并且children也呈现在那里。

export function PropsChildren({ children, ...props }) {
  console.log("info props", props.name, props.age);
  return (
    <div>
      <p>Props name is {props.name}</p>
      <p>Props age is {props.age}</p>
    </div>
  );
}

推荐阅读