In React js how to take input like this <MyComponent> some text input </MyComponent> ? N-CodePudding

I was trying to take input like this : 'my text'

so that when I call I will be able to use 'my text' inside it. Note: I don't want to take it as props.

CodePudding user response：

i think you could create component like

import React from 'react';

const Mytext = ({ children }) => {
  return <input placeholder={children} />;
};

export default Mytext;

and use like

<Mytext>email</Mytext>

CodePudding user response：

If you want to pass your text the following way: <MyComponent>Some text</MyComponent>, then you can access "Some text" in MyComponent only by using children props. Learn more: Composition vs Inheritance

If you do not want to use props at all, then you should not pass anything directly to the components (<MyComponent />). In this case, you will need some global storage, like useContext or Redux.