xgqfrms™, xgqfrms® : xgqfrms's offical website of GitHub!

taro render html

html = `<h1 style='color: red'>Wallace is way taller than other reporters.</h1>`;
// "<h1 style='color: red'>Wallace is way taller than other reporters.</h1>"

text = html.replace(/<h1/ig, '<Text').replace(/</h1>/ig, '</Text>');
// "<Text style='color: red'>Wallace is way taller than other reporters.</Text>"

  const html = `<h1 style='color: red'>Wallace is way taller than other reporters.</h1>`;
  const htmlRender = (html = ``) => {
    const text = html.replace(/<h1/ig, '<Text').replace(/</h1>/ig, '</Text>');
    return (
      <View>{text}</View>
    );
  }

AST parse html ???

---

RichText

https://nervjs.github.io/taro/docs/components/base/rich-text.html#htmlelement

https://developers.weixin.qq.com/miniprogram/dev/component/rich-text.html

    const html = `<h1 style='color: red'>Wallace is way taller than other reporters.</h1>`;
    const htmlRender = (html = ``) => {
      const text = html.replace(/<h1/ig, '<Text').replace(/</h1>/ig, '</Text>');
      return (
        <View>{text}</View>
      );
    }
    return (
      <View className='index-box'>
        <Text>index</Text>
        {/* {htmlRender(html)} */}
        <RichText nodes={html} />
      </View>
    )

    const detailDesc = `<p><span style="font-size:18px"><span style="color:#008000">指针测试社群字段</span></span></p>

<p><span style="font-size:18px"><span style="color:#008000"><img alt="" src="https://o8qg9birw.qnssl.com/content/2b493805ac28efdd4c31562f52b5306256f6978c.jpg" style="height:736px; 414px" /></span></span></p>
`;
    return (
      <View className='index-box'>
        <RichText nodes={detailDesc} />
      </View>
    )

---

H5 OK

alipay Error

wx ??? html tag filter

---