分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 代码编程

react--使用div编辑属性contenteditable渲染HTML标签

发布时间:2023-09-06 01:51责任编辑:傅花花关键词:HTMLdiv

输入的时候完全没有问题,但是在修改涉及到使用其渲染的时候,就会把字符串渲染出来,而不是渲染原生的标签对

渲染时要使用 dangerouslySetInnerHTML属性,并且传入对象进行渲染

render函数return部分:

     <div ref="add" contenteditable="true" className={styles.areaBox}></div> ???????<button onClick={(e) => { this.test(e) }}></button> ???????<div contenteditable="true" dangerouslySetInnerHTML={{__html: `${this.state.add}`}} className={styles.areaBox}></div>

方法部分 :

 test = () => { ???this.setState({ ?????add: this.refs.add.innerHTML ???}) ?}

状态部分 :

 constructor(props) { ???super(props);
???this.state = { ?????add: "" ???}
?}

 

react--使用div编辑属性contenteditable渲染HTML标签

原文地址:https://www.cnblogs.com/opacity-m/p/8947788.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved