React Transferring Props except one

Question

React suggests to Transfer Props. Neat!

How can I transfert all but one?

render: function(){
  return (

        

Answer 1

Thank you @villeaka!

Here's an example of how I used your solution for other people to better understand it's usage.

I basically used it to create a stateless wrapping-component that I then needed to pass its props to the inner component (Card).

I needed the wrapper because of the rendering logic inside another top level component that used this wrapper like this:

  {/* if condition render this: */}
   {/* note: props here is TLC's props */}
    
      {props.children}
    
  
  {/* if other condition render this: */}
  {/* ... */}
  {/* and repeat */}

where several conditions determine what comes after the H4 in the wrapper (see actual rendered node tree below).

So basically, I didn't want to duplicate code by writing the entire part that comes before {children} in the example below, for each arm of the conditional in the top level component that renders multiple variants of the wrapper from above example:

const CardWrapper: React.FC = (props) => {
  const { children, ...otherProps } = props;
  return (
    
      

        Unanswered requests
      
      {children}
    
  );
};

And concrete usage in a React render function:

if (error)
  return (
    
      
        {error}
      
    
  );

if (loading)
  return (
    
      
    
  );

if (!data)
  return (
    
      
    
  );

// etc.

So the above just adds the H4 header before the children of the wrapper and also passes down the props that it has been passed down to, to the inner Card component.