点击文字元素，元素变为可编辑元素

 

点击文字元素变为input

方法一

　　增加 contentEditable 属性 

<h1 className="editable-field" contentEditable={true} suppressContentEditableWarning={true} > summary </h1>

 

 

点击文字元素变为select

方法一

　　1.  每个FormItem对应两个元素，第一个为p文字元素，第二个为可编辑的select。

　　2. 点击p元素后，state中的selectedItem属性设为该元素的label属性

　　3. 如果selectedItem等于某个FormItem的label值，那么显示隐藏p显示select

方法二

　　1.  每个可编辑的元素对应两个元素，第一个为p文字元素，第二个为可编辑的select。

　　2. 默认情况下，select元素为隐藏状态，点击p元素，p元素的display属性设为none，select的display属性设为block

　　3. 点击其它元素，p元素display属性设为none

转载于:https://www.cnblogs.com/xiaochengzi/p/10370041.html