这个问题与html-to-react库有关。
假设我有下面的 *html字符串 *:'<div> <img src="test.png" style="width: 100px;"/> <img src="test2.png" style="margin: 0px 4px;"/> </div>'
通常我会这样解析:
import {Parser} from 'html-to-react'
const reactElement = Parser.parse(htmlString);
这将生成一个React元素,其中有一个div
和两个嵌套的img
元素作为其子元素。
我怎样才能解析这个字符串,使每个img
都被一个自定义的Image
组件替换,保留img
的原始 prop /属性(包括样式)?
例如,所得到的react元素将具有以下子元素:<div> <Image src="test.png" style={{width: 100}}/> <Image src="test2.png" style={{margin: "0px 4px"}}/> </div>
感谢帮助!谢谢
2条答案
按热度按时间2sbarzqh1#
你可以通过以下步骤来实现这一点,
这并不能完全解决你的问题,因为我可以看到你需要两个不同的风格为两个图像标签,但玩这个可能会给你一个解决方案。
nwsw7zdq2#
请试试这个: