taro 函数式组件 使用wxParse

在 Taro 中，可以使用 `wxParse` 库将 HTML 字符串解析为 WXML 节点数组，在小程序中渲染出来。对于函数式组件，可以使用 `useEffect` 钩子函数来获取渲染节点后执行解析操作。

以下是示例代码：

import Taro, { useState, useEffect } from '@tarojs/taro'
import { View } from '@tarojs/components'
import wxParse from '../../../utils/wxParse/wxParse'

function MyComponent() {
  const [nodes, setNodes] = useState([])

  useEffect(() => {
    Taro.createSelectorQuery().select('#myHtml').boundingClientRect(rect => {
      wxParse('html', '<div>Hello, world!</div>', res => {
        setNodes(res.nodes)
      })
    }).exec()
  }, [])

  return (
    <View>
      <import src='../../../miniprogram_npm/@tarojs/taro-wx/index.wxml' />
      <template is='parse' data='{{nodes: nodes}}' />
      <view id='myHtml' />
    </View>
  )
}

export default MyComponent

在上述示例代码中，使用 `useState` 定义节点数组 `nodes`，使用 `useEffect` 钩子函数在组件挂载后获取节点 `#myHtml` 的 `boundingClientRect`，并在回调函数中调用 `wxParse` 方法将 HTML 字符串解析为 WXML 节点数组，最后使用 `setNodes` 更新节点数组。需要注意的是，在视图中使用 `<import>` 导入 `taro-wx` 组件库的 `index.wxml` 文件，以便使用 `<template>` 渲染节点数组。