html字符串转换jsx,javascript – 将React.element转换为JSX字符串

我正在尝试构建一个组件,

>带孩子和

>渲染DOM中的子项,以及

>出于文档的目的,在pre中显示子DOM

一种解决方案是将JSX作为单独的prop传递.这使得它重复,因为我已经能够通过this.props.children访问它.理想情况下,我只需要以某种方式将子prop转换为字符串,以便我可以在pre中呈现它以显示“此代码生成此结果”.

这就是我到目前为止所拥有的

class DocumentationSection extends React.Component{

render(){

return

{heading || ""}

{this.props.children}

//Change this to produce a JSX string from the elements

{this.props.children}

;

}

}

如何以’< Div className ='myDiv'> …< / Div>格式获取jsx字符串?当我将DocumentationSection渲染为

...

谢谢.

编辑:

我试过toString,它dint work,给了[object Object]

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/396013.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Leetcode:0002(两数之和)

LeetCode&#xff1a;0002&#xff08;两数之和&#xff09; 题目描述&#xff1a;给定两个非空链表来表示两个非负整数。位数按照逆序方式存储&#xff0c;它们的每个节点只存储单个数字。将两数相加返回一个新的链表。你可以假设除了数字 0 之外&#xff0c;这两个数字都不会…

《Excel 职场手册:260招菜鸟变达人》一第 13 招 利用数据验证给单元格添加注释,不用批注...

本节书摘来异步社区《Excel 职场手册&#xff1a;260招菜鸟变达人》一书中的第1章&#xff0c;第13节&#xff0c;作者&#xff1a; 聂春霞 , 佛山小老鼠 责编&#xff1a; 王峰松&#xff0c;更多章节内容可以访问云栖社区“异步社区”公众号查看。 第 13 招 利用数据验证给单…

招银网络笔试java_春招|招银网络Java软件开发 电话面试+一二三面面经

电话面试:1.自我介绍2.介绍项目经历(我介绍的时候说了用到spring&#xff0c;spring MVC和hibernate框架)3.为什么用spring框架&#xff0c;有什么优点4.详细说下aop5.解释下IOC&#xff0c;IOC有什么好处6.spring MVC的运行流程7.spring除了注解注入还有什么方式8.hibernate框…

Numpy and Pandas

安装 视频链接&#xff1a;https://morvanzhou.github.io/tutorials/data-manipulation/np-pd/ pip install numpy pip install pandas Numpy 学习 Numpy属性 import numpy as nparray np.array([[1,2,3],[2,3,4]]) print(array) print(number of dim:,array.ndim)//几维度 pr…

认证android retrofit,Retrofit之项目介绍

项目介绍官网对retrofit介绍是这是一个"类型安全(type-safe)"的Android/Java http客户端. 目前retrofit的最新正式版本为1.9.0. 2.0版本预计2015年底发布, 相较于之前版本, 2.0版本在架构上做了很大改变, 本文代码相关的内容都是基于retrofit2.0-beta2.注: 在编程语言…

层次聚类算法 算法_聚类算法简介

层次聚类算法 算法Take a look at the image below. It’s a collection of bugs and creepy-crawlies of different shapes and sizes. Take a moment to categorize them by similarity into a number of groups.看看下面的图片。 它是各种形状和大小的错误和令人毛骨悚然的爬…

.h .dll .lib

.h为对一个函数的声明引用&#xff0c;include就是声明某个文件里的函数&#xff08;内只有声明函数被引用了&#xff09;&#xff0c;编译时使用 .lib为链接时用的&#xff0c;存放的是对于DLL里函数的位置信息等&#xff0c;这样不必把所有dll里函数都加载到内存里&#xff0…

《机器人学经典教程》——2.2 控制论

本节书摘来异步社区《机器人学经典教程》一书中的第2章&#xff0c;第2.2节&#xff0c;作者&#xff1a;【美】Maja J. Matarić&#xff08;马娅•马塔里奇&#xff09;&#xff0c;更多章节内容可以访问云栖社区“异步社区”公众号查看。 2.2 控制论 随着控制理论的不断发展…

哔哩哔哩网站前端源码_分享一个仿制哔哩哔哩镜子网站源码

我老婆非常喜欢看哔哩哔哩&#xff0c;前些天她兴奋地和我说哔哩哔哩网站有个隐藏的彩蛋&#xff0c;传送门http://www.ilidilid.com/&#xff0c;我看了下&#xff0c;相当于把镜子中的网站样子弄出来了。于是&#xff0c;我寻思着&#xff0c;把自己的博客也弄个这样的彩蛋&a…

promise-async-await

通常而言&#xff0c;这3个关键字 都是用来「优雅」的处理ajax异步请求的 //es6的时候promise诞生&#xff0c;很好的解决了嵌套回调地狱&#xff0c;改良方案为链式回调。// es2017的时候诞生了async、await&#xff0c;这下异步直接没有回调了&#xff0c;像同步一样爽//没有…

第一冲刺阶段博客检查

我们检查的团队是&#xff1a;红鸟 ①团队博客&#xff1a; 该团队将所有的站立会议均写到了4月28日的一篇博客中&#xff0c;并且其中任务看板和燃尽图不全。 ②团队成员个人博客&#xff1a; 1>张晓晨&#xff1a; 没有每天个人工作总结。 2>王晓思&#xff1a; 从4.19…

netcore 编译 html,Asp.Net Core中的@ Html.Action

小编典典更新&#xff1a;从2.2.2版本开始&#xff0c;HttpContextAccessor将上下文保留在一个对象中(据说是为了防止请求之间的混淆)&#xff0c;这会影响当前解决方案…因此&#xff0c;您需要为IHttpContextAccessor(旧版本)提供以下实现并进行注册作为一个单例&#xff1a;…

《CCIE路由和交换认证考试指南(第5版) (第1卷)》——1.6节虚拟交换系统

本节书摘来自异步社区《CCIE路由和交换认证考试指南&#xff08;第5版&#xff09; &#xff08;第1卷&#xff09;》一书中的第1章&#xff0c;第1.6节虚拟交换系统&#xff0c;作者 【美】Narbik Kocharians&#xff08;那比克 科查理安&#xff09; , 【斯洛伐克】Peter Pal…

机器学习 美股_我如何使用机器学习来探索英美文学之间的差异

机器学习 美股by Sofia Godovykh索非亚戈多维克(Sofia Godovykh) 我如何使用机器学习来探索英美文学之间的差异 (How I used machine learning to explore the differences between British and American literature) As I delved further into English literature to further…

远程执行漏洞修复方案_请马上修复!SaltStack远程命令执行漏洞

【漏洞预警】SaltStack远程命令执行漏洞(CVE-2020-11651、CVE-2020-11652)2020年5月3日&#xff0c;阿里云应急响应中心监测到近日国外某安全团队披露了SaltStack存在认证绕过致命令执行漏洞以及目录遍历漏洞。漏洞描述SaltStack是基于Python开发的一套C/S架构配置管理工具。国…

kafka部分重要参数配置-broker端参数

broker端参数主要在config/server.properties目录下设置&#xff1a; 启动命令&#xff1a;nohup ./kafka-server-start.sh -daemon ../config/server.properties & broker.id参数&#xff1a;Kafka使用唯一的一个整数来标识每个broker&#xff0c;全局唯一&#xff0c;默认…

JS正则表达式大全(整理详细且实用)

JS正则表达式大全(整理详细且实用) 作者&#xff1a; 字体&#xff1a;[增加 减小] 类型&#xff1a;转载 时间&#xff1a;2013-11-14 我要评论 JS正则表达式大全(整理详细且实用)。需要的朋友可以过来参考下&#xff0c;希望对大家有所帮助正则表达式中的特殊字符 字符 含意…

html设置模块宽度为200像素,css 宽度(CSS width)

DIV CSS宽度width样式属性CSS 宽度是指通过CSS 样式设置对应div宽度&#xff0c;以下我们了解传统html宽度、宽度自适应百分比、固定宽度等宽度知识。传统Html 宽度属性单词&#xff1a;width 如width"300";CSS 宽度属性单词&#xff1a;width 如width:300px;一、Wid…

我从Stack Overflow对64,000名开发人员的大规模调查中学到的东西

Today Stack Overflow released the results of their 2017 survey of more than 64,000 developers.今天&#xff0c;Stack Overflow发布了他们对64,000多名开发人员的2017年调查结果。 Just like in 2016, I’ve combed through these results and summarized them for you.…

《Node应用程序构建——使用MongoDB和Backbone》一第 1 章 介绍与总览1.1 打造一个社交网络...

本节书摘来自异步社区《Node应用程序构建——使用MongoDB和Backbone》一书中的第1章&#xff0c;第1.1节&#xff0c;作者【美】Mike Wilson&#xff0c;更多章节内容可以访问云栖社区“异步社区”公众号查看 第 1 章 介绍与总览 Node应用程序构建——使用MongoDB和Backbone互…