I need to show specific content for users who can edit and view.
I am trying to get specific html element for rich editor . - user can edit inside this div content content - user can only read classname="header"
<div classname="main">
<div classname="header"> it can be read only</div>
<div classname="contenteditable">it can be edit only</div> </div> How can i do this by using reactjs
Serdar Sanri
Sr. Frontend Developer
I might be misunderstanding what you are trying to do here but you can create multiple components for each and pass readonly prop from parent. and inside the component depending on readonly prop, you can show different content.
const Header = ({readonly, ...props}) => <div className='header'></div> const Body = ({readonly, ...props}) => <div className="contenteditable"> {readonly ? ( // content is readonly ) : ( // content is not readonly create your editor here ) } </div> const Main = props => ( <div className="main"> <Header readonly={true}> <Body readonly={false}/> </div> )