Initial commit

components/gaoyia-parse/components/wxParseAudio.vue

@@ -0,0 +1,29 @@
+<template>
+  <!-- '<audio/>' 组件不再维护，建议使用能力更强的 'uni.createInnerAudioContext' 接口 有时间再改-->
+  <!--增加audio标签支持-->
+  <audio
+    :id="node.attr.id"
+    :class="node.classStr"
+    :style="node.styleStr"
+    :src="node.attr.src"
+    :loop="node.attr.loop"
+    :poster="node.attr.poster"
+    :name="node.attr.name"
+    :author="node.attr.author"
+    controls
+  ></audio>
+</template>
+
+<script>
+export default {
+  name: "wxParseAudio",
+  props: {
+    node: {
+      type: Object,
+      default() {
+        return {};
+      },
+    },
+  },
+};
+</script>

components/gaoyia-parse/components/wxParseImg.vue

@@ -0,0 +1,95 @@
+<template>
+  <image
+    :mode="node.attr.mode"
+    :lazy-load="node.attr.lazyLoad"
+    :class="node.classStr"
+    :style="newStyleStr || node.styleStr"
+    :data-src="node.attr.src"
+    :src="node.attr.src"
+    @tap="wxParseImgTap"
+    @load="wxParseImgLoad"
+  />
+</template>
+
+<script>
+export default {
+  name: "wxParseImg",
+  data() {
+    return {
+      newStyleStr: "",
+      preview: false,
+    };
+  },
+  inject: ["parseWidth"],
+  mounted() {},
+  props: {
+    node: {
+      type: Object,
+      default() {
+        return {};
+      },
+    },
+  },
+
+  methods: {
+    wxParseImgTap(e) {
+      if (!this.preview) return;
+      const { src } = e.currentTarget.dataset;
+      if (!src) return;
+      let parent = this.$parent;
+      while (!parent.preview || typeof parent.preview !== "function") {
+        // TODO 遍历获取父节点执行方法
+        parent = parent.$parent;
+      }
+      parent.preview(src, e);
+    },
+    // 图片视觉宽高计算函数区
+    wxParseImgLoad(e) {
+      const { src } = e.currentTarget.dataset;
+      if (!src) return;
+      let { width, height } = e.mp.detail;
+
+      const recal = this.wxAutoImageCal(width, height);
+
+      const { imageheight, imageWidth } = recal;
+      const { padding, mode } = this.node.attr; //删除padding
+      // const { mode } = this.node.attr;
+
+      const { styleStr } = this.node;
+      const imageHeightStyle =
+        mode === "widthFix" ? "" : `height: ${imageheight}px;`;
+
+      this.newStyleStr = `${styleStr}; ${imageHeightStyle}; width: ${imageWidth}px; padding: 0 ${+padding}px;`; //删除padding
+      // this.newStyleStr = `${styleStr}; ${imageHeightStyle}; width: ${imageWidth}px;`;
+    },
+    // 计算视觉优先的图片宽高
+    wxAutoImageCal(originalWidth, originalHeight) {
+      // 获取图片的原始长宽
+      const windowWidth = this.parseWidth.value;
+      const results = {};
+
+      if (originalWidth < 60 || originalHeight < 60) {
+        const { src } = this.node.attr;
+        let parent = this.$parent;
+        while (!parent.preview || typeof parent.preview !== "function") {
+          parent = parent.$parent;
+        }
+        parent.removeImageUrl(src);
+        this.preview = false;
+      }
+
+      // 判断按照那种方式进行缩放
+      if (originalWidth > windowWidth) {
+        // 在图片width大于手机屏幕width时候
+        results.imageWidth = windowWidth;
+        results.imageheight = windowWidth * (originalHeight / originalWidth);
+      } else {
+        // 否则展示原来的数据
+        results.imageWidth = originalWidth;
+        results.imageheight = originalHeight;
+      }
+      return results;
+    },
+  },
+};
+</script>

components/gaoyia-parse/components/wxParseTable.vue

@@ -0,0 +1,59 @@
+<template>
+  <div class="tablebox">
+    <rich-text
+      :nodes="nodes"
+      :class="node.classStr"
+      :style="'user-select:' + parseSelect"
+    ></rich-text>
+  </div>
+</template>
+<script>
+export default {
+  name: "wxParseTable",
+  props: {
+    node: {
+      type: Object,
+      default() {
+        return {};
+      },
+    },
+  },
+  inject: ["parseSelect"],
+  data() {
+    return {
+      nodes: [],
+    };
+  },
+  mounted() {
+    this.nodes = this.loadNode([this.node]);
+  },
+  methods: {
+    loadNode(node) {
+      let obj = [];
+      for (let children of node) {
+        if (children.node == "element") {
+          let t = {
+            name: children.tag,
+            attrs: {
+              class: children.classStr,
+              // style: children.styleStr,
+            },
+            children: children.nodes ? this.loadNode(children.nodes) : [],
+          };
+
+          obj.push(t);
+        } else if (children.node == "text") {
+          obj.push({
+            type: "text",
+            text: children.text,
+          });
+        }
+      }
+      return obj;
+    },
+  },
+};
+</script>
+<style>
+@import url("../parse.css");
+</style>

components/gaoyia-parse/components/wxParseTemplate0.vue

@@ -0,0 +1,122 @@
+<template>
+  <!--判断是否是标签节点-->
+  <block v-if="node.node == 'element'">
+    <!--button类型-->
+    <button
+      v-if="node.tag == 'button'"
+      type="default"
+      size="mini"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <wx-parse-template :node="node" />
+    </button>
+
+    <!--a类型-->
+    <view
+      v-else-if="node.tag == 'a'"
+      @click="wxParseATap(node.attr, $event)"
+      :class="node.classStr"
+      :data-href="node.attr.href"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--li类型-->
+    <view
+      v-else-if="node.tag == 'li'"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--table类型-->
+    <wx-parse-table
+      v-else-if="node.tag == 'table'"
+      :class="node.classStr"
+      :style="node.styleStr"
+      :node="node"
+    />
+
+    <!--br类型-->
+    <!-- #ifndef H5 -->
+    <text v-else-if="node.tag == 'br'">\n</text>
+    <!-- #endif -->
+    <!-- #ifdef H5 -->
+    <br v-else-if="node.tag == 'br'" />
+    <!-- #endif -->
+
+    <!--video类型-->
+    <wx-parse-video :node="node" v-else-if="node.tag == 'video'" />
+
+    <!--audio类型-->
+    <wx-parse-audio :node="node" v-else-if="node.tag == 'audio'" />
+
+    <!--img类型-->
+    <wx-parse-img
+      :node="node"
+      v-else-if="node.tag == 'img'"
+      :style="node.styleStr"
+    />
+
+    <!--其他标签-->
+    <view v-else :class="node.classStr" :style="node.styleStr">
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+  </block>
+
+  <!--判断是否是文本节点-->
+  <block v-else-if="node.node == 'text'">{{ node.text }}</block>
+</template>
+
+<script>
+// #ifdef APP-PLUS | H5
+import wxParseTemplate from "./wxParseTemplate0";
+// #endif
+// #ifdef MP
+import wxParseTemplate from "./wxParseTemplate1";
+// #endif
+import wxParseImg from "./wxParseImg";
+import wxParseVideo from "./wxParseVideo";
+import wxParseAudio from "./wxParseAudio";
+import wxParseTable from "./wxParseTable";
+
+export default {
+  // #ifdef APP-PLUS | H5
+  name: "wxParseTemplate",
+  // #endif
+  // #ifdef MP
+  name: "wxParseTemplate0",
+  // #endif
+  props: {
+    node: {},
+  },
+  components: {
+    wxParseTemplate,
+    wxParseImg,
+    wxParseVideo,
+    wxParseAudio,
+    wxParseTable,
+  },
+  methods: {
+    wxParseATap(attr, e) {
+      const { href } = e.currentTarget.dataset; // TODO currentTarget才有dataset
+      if (!href) return;
+      let parent = this.$parent;
+      while (!parent.preview || typeof parent.preview !== "function") {
+        // TODO 遍历获取父节点执行方法
+        parent = parent.$parent;
+      }
+      parent.navigate(href, e, attr);
+    },
+  },
+};
+</script>

components/gaoyia-parse/components/wxParseTemplate1.vue

@@ -0,0 +1,111 @@
+<template>
+  <!--判断是否是标签节点-->
+  <block v-if="node.node == 'element'">
+    <!--button类型-->
+    <button
+      v-if="node.tag == 'button'"
+      type="default"
+      size="mini"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <wx-parse-template :node="node" />
+    </button>
+
+    <!--a类型-->
+    <view
+      v-else-if="node.tag == 'a'"
+      @click="wxParseATap(node.attr, $event)"
+      :class="node.classStr"
+      :data-href="node.attr.href"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--li类型-->
+    <view
+      v-else-if="node.tag == 'li'"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--table类型-->
+    <wx-parse-table
+      v-else-if="node.tag == 'table'"
+      :class="node.classStr"
+      :style="node.styleStr"
+      :node="node"
+    />
+
+    <!--br类型-->
+    <!-- #ifndef H5 -->
+    <text v-else-if="node.tag == 'br'">\n</text>
+    <!-- #endif -->
+    <!-- #ifdef H5 -->
+    <br v-else-if="node.tag == 'br'" />
+    <!-- #endif -->
+
+    <!--video类型-->
+    <wx-parse-video :node="node" v-else-if="node.tag == 'video'" />
+
+    <!--audio类型-->
+    <wx-parse-audio :node="node" v-else-if="node.tag == 'audio'" />
+
+    <!--img类型-->
+    <wx-parse-img
+      :node="node"
+      v-else-if="node.tag == 'img'"
+      :style="node.styleStr"
+    />
+
+    <!--其他标签-->
+    <view v-else :class="node.classStr" :style="node.styleStr">
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+  </block>
+
+  <!--判断是否是文本节点-->
+  <block v-else-if="node.node == 'text'">{{ node.text }}</block>
+</template>
+
+<script>
+import wxParseTemplate from "./wxParseTemplate2";
+import wxParseImg from "./wxParseImg";
+import wxParseVideo from "./wxParseVideo";
+import wxParseAudio from "./wxParseAudio";
+import wxParseTable from "./wxParseTable";
+
+export default {
+  name: "wxParseTemplate1",
+  props: {
+    node: {},
+  },
+  components: {
+    wxParseTemplate,
+    wxParseImg,
+    wxParseVideo,
+    wxParseAudio,
+    wxParseTable,
+  },
+  methods: {
+    wxParseATap(attr, e) {
+      const { href } = e.currentTarget.dataset;
+      if (!href) return;
+      let parent = this.$parent;
+      while (!parent.preview || typeof parent.preview !== "function") {
+        parent = parent.$parent;
+      }
+      parent.navigate(href, e, attr);
+    },
+  },
+};
+</script>

components/gaoyia-parse/components/wxParseTemplate10.vue

@@ -0,0 +1,111 @@
+<template>
+  <!--判断是否是标签节点-->
+  <block v-if="node.node == 'element'">
+    <!--button类型-->
+    <button
+      v-if="node.tag == 'button'"
+      type="default"
+      size="mini"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <wx-parse-template :node="node" />
+    </button>
+
+    <!--a类型-->
+    <view
+      v-else-if="node.tag == 'a'"
+      @click="wxParseATap(node.attr, $event)"
+      :class="node.classStr"
+      :data-href="node.attr.href"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--li类型-->
+    <view
+      v-else-if="node.tag == 'li'"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--table类型-->
+    <wx-parse-table
+      v-else-if="node.tag == 'table'"
+      :class="node.classStr"
+      :style="node.styleStr"
+      :node="node"
+    />
+
+    <!--br类型-->
+    <!-- #ifndef H5 -->
+    <text v-else-if="node.tag == 'br'">\n</text>
+    <!-- #endif -->
+    <!-- #ifdef H5 -->
+    <br v-else-if="node.tag == 'br'" />
+    <!-- #endif -->
+
+    <!--video类型-->
+    <wx-parse-video :node="node" v-else-if="node.tag == 'video'" />
+
+    <!--audio类型-->
+    <wx-parse-audio :node="node" v-else-if="node.tag == 'audio'" />
+
+    <!--img类型-->
+    <wx-parse-img
+      :node="node"
+      v-else-if="node.tag == 'img'"
+      :style="node.styleStr"
+    />
+
+    <!--其他标签-->
+    <view v-else :class="node.classStr" :style="node.styleStr">
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+  </block>
+
+  <!--判断是否是文本节点-->
+  <block v-else-if="node.node == 'text'">{{ node.text }}</block>
+</template>
+
+<script>
+import wxParseTemplate from "./wxParseTemplate11";
+import wxParseImg from "./wxParseImg";
+import wxParseVideo from "./wxParseVideo";
+import wxParseAudio from "./wxParseAudio";
+import wxParseTable from "./wxParseTable";
+
+export default {
+  name: "wxParseTemplate10",
+  props: {
+    node: {},
+  },
+  components: {
+    wxParseTemplate,
+    wxParseImg,
+    wxParseVideo,
+    wxParseAudio,
+    wxParseTable,
+  },
+  methods: {
+    wxParseATap(attr, e) {
+      const { href } = e.currentTarget.dataset;
+      if (!href) return;
+      let parent = this.$parent;
+      while (!parent.preview || typeof parent.preview !== "function") {
+        parent = parent.$parent;
+      }
+      parent.navigate(href, e, attr);
+    },
+  },
+};
+</script>

components/gaoyia-parse/components/wxParseTemplate11.vue

@@ -0,0 +1,121 @@
+<template>
+  <!--判断是否是标签节点-->
+  <block v-if="node.node == 'element'">
+    <!--button类型-->
+    <button
+      v-if="node.tag == 'button'"
+      type="default"
+      size="mini"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <rich-text
+        :nodes="node"
+        :class="node.classStr"
+        :style="'user-select:' + parseSelect"
+      ></rich-text>
+    </button>
+
+    <!--a类型-->
+    <view
+      v-else-if="node.tag == 'a'"
+      @click="wxParseATap(node.attr, $event)"
+      :class="node.classStr"
+      :data-href="node.attr.href"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <rich-text
+          :nodes="node"
+          :class="node.classStr"
+          :style="'user-select:' + parseSelect"
+        ></rich-text>
+      </block>
+    </view>
+
+    <!--li类型-->
+    <view
+      v-else-if="node.tag == 'li'"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <rich-text
+          :nodes="node"
+          :class="node.classStr"
+          :style="'user-select:' + parseSelect"
+        ></rich-text>
+      </block>
+    </view>
+
+    <!--table类型-->
+    <wx-parse-table
+      v-else-if="node.tag == 'table'"
+      :class="node.classStr"
+      :style="node.styleStr"
+      :node="node"
+    />
+
+    <!--br类型-->
+    <!-- #ifndef H5 -->
+    <text v-else-if="node.tag == 'br'">\n</text>
+    <!-- #endif -->
+    <!-- #ifdef H5 -->
+    <br v-else-if="node.tag == 'br'" />
+    <!-- #endif -->
+
+    <!--video类型-->
+    <wx-parse-video :node="node" v-else-if="node.tag == 'video'" />
+
+    <!--audio类型-->
+    <wx-parse-audio :node="node" v-else-if="node.tag == 'audio'" />
+
+    <!--img类型-->
+    <wx-parse-img :node="node" v-else-if="node.tag == 'img'" />
+
+    <!--其他标签-->
+    <view v-else :class="node.classStr" :style="node.styleStr">
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <rich-text
+          :nodes="node"
+          :class="node.classStr"
+          :style="'user-select:' + parseSelect"
+        ></rich-text>
+      </block>
+    </view>
+  </block>
+
+  <!--判断是否是文本节点-->
+  <block v-else-if="node.node == 'text'">{{ node.text }}</block>
+</template>
+
+<script>
+import wxParseImg from "./wxParseImg";
+import wxParseVideo from "./wxParseVideo";
+import wxParseAudio from "./wxParseAudio";
+import wxParseTable from "./wxParseTable";
+
+export default {
+  name: "wxParseTemplate11",
+  props: {
+    node: {},
+  },
+  components: {
+    wxParseImg,
+    wxParseVideo,
+    wxParseAudio,
+    wxParseTable,
+  },
+  methods: {
+    wxParseATap(attr, e) {
+      const { href } = e.currentTarget.dataset;
+      if (!href) return;
+      let parent = this.$parent;
+      while (!parent.preview || typeof parent.preview !== "function") {
+        parent = parent.$parent;
+      }
+      parent.navigate(href, e, attr);
+    },
+  },
+};
+</script>

components/gaoyia-parse/components/wxParseTemplate2.vue

@@ -0,0 +1,111 @@
+<template>
+  <!--判断是否是标签节点-->
+  <block v-if="node.node == 'element'">
+    <!--button类型-->
+    <button
+      v-if="node.tag == 'button'"
+      type="default"
+      size="mini"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <wx-parse-template :node="node" />
+    </button>
+
+    <!--a类型-->
+    <view
+      v-else-if="node.tag == 'a'"
+      @click="wxParseATap(node.attr, $event)"
+      :class="node.classStr"
+      :data-href="node.attr.href"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--li类型-->
+    <view
+      v-else-if="node.tag == 'li'"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--table类型-->
+    <wx-parse-table
+      v-else-if="node.tag == 'table'"
+      :class="node.classStr"
+      :style="node.styleStr"
+      :node="node"
+    />
+
+    <!--br类型-->
+    <!-- #ifndef H5 -->
+    <text v-else-if="node.tag == 'br'">\n</text>
+    <!-- #endif -->
+    <!-- #ifdef H5 -->
+    <br v-else-if="node.tag == 'br'" />
+    <!-- #endif -->
+
+    <!--video类型-->
+    <wx-parse-video :node="node" v-else-if="node.tag == 'video'" />
+
+    <!--audio类型-->
+    <wx-parse-audio :node="node" v-else-if="node.tag == 'audio'" />
+
+    <!--img类型-->
+    <wx-parse-img
+      :node="node"
+      v-else-if="node.tag == 'img'"
+      :style="node.styleStr"
+    />
+
+    <!--其他标签-->
+    <view v-else :class="node.classStr" :style="node.styleStr">
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+  </block>
+
+  <!--判断是否是文本节点-->
+  <block v-else-if="node.node == 'text'">{{ node.text }}</block>
+</template>
+
+<script>
+import wxParseTemplate from "./wxParseTemplate3";
+import wxParseImg from "./wxParseImg";
+import wxParseVideo from "./wxParseVideo";
+import wxParseAudio from "./wxParseAudio";
+import wxParseTable from "./wxParseTable";
+
+export default {
+  name: "wxParseTemplate2",
+  props: {
+    node: {},
+  },
+  components: {
+    wxParseTemplate,
+    wxParseImg,
+    wxParseVideo,
+    wxParseAudio,
+    wxParseTable,
+  },
+  methods: {
+    wxParseATap(attr, e) {
+      const { href } = e.currentTarget.dataset;
+      if (!href) return;
+      let parent = this.$parent;
+      while (!parent.preview || typeof parent.preview !== "function") {
+        parent = parent.$parent;
+      }
+      parent.navigate(href, e, attr);
+    },
+  },
+};
+</script>

components/gaoyia-parse/components/wxParseTemplate3.vue

@@ -0,0 +1,111 @@
+<template>
+  <!--判断是否是标签节点-->
+  <block v-if="node.node == 'element'">
+    <!--button类型-->
+    <button
+      v-if="node.tag == 'button'"
+      type="default"
+      size="mini"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <wx-parse-template :node="node" />
+    </button>
+
+    <!--a类型-->
+    <view
+      v-else-if="node.tag == 'a'"
+      @click="wxParseATap(node.attr, $event)"
+      :class="node.classStr"
+      :data-href="node.attr.href"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--li类型-->
+    <view
+      v-else-if="node.tag == 'li'"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--table类型-->
+    <wx-parse-table
+      v-else-if="node.tag == 'table'"
+      :class="node.classStr"
+      :style="node.styleStr"
+      :node="node"
+    />
+
+    <!--br类型-->
+    <!-- #ifndef H5 -->
+    <text v-else-if="node.tag == 'br'">\n</text>
+    <!-- #endif -->
+    <!-- #ifdef H5 -->
+    <br v-else-if="node.tag == 'br'" />
+    <!-- #endif -->
+
+    <!--video类型-->
+    <wx-parse-video :node="node" v-else-if="node.tag == 'video'" />
+
+    <!--audio类型-->
+    <wx-parse-audio :node="node" v-else-if="node.tag == 'audio'" />
+
+    <!--img类型-->
+    <wx-parse-img
+      :node="node"
+      v-else-if="node.tag == 'img'"
+      :style="node.styleStr"
+    />
+
+    <!--其他标签-->
+    <view v-else :class="node.classStr" :style="node.styleStr">
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+  </block>
+
+  <!--判断是否是文本节点-->
+  <block v-else-if="node.node == 'text'">{{ node.text }}</block>
+</template>
+
+<script>
+import wxParseTemplate from "./wxParseTemplate4";
+import wxParseImg from "./wxParseImg";
+import wxParseVideo from "./wxParseVideo";
+import wxParseAudio from "./wxParseAudio";
+import wxParseTable from "./wxParseTable";
+
+export default {
+  name: "wxParseTemplate3",
+  props: {
+    node: {},
+  },
+  components: {
+    wxParseTemplate,
+    wxParseImg,
+    wxParseVideo,
+    wxParseAudio,
+    wxParseTable,
+  },
+  methods: {
+    wxParseATap(attr, e) {
+      const { href } = e.currentTarget.dataset;
+      if (!href) return;
+      let parent = this.$parent;
+      while (!parent.preview || typeof parent.preview !== "function") {
+        parent = parent.$parent;
+      }
+      parent.navigate(href, e, attr);
+    },
+  },
+};
+</script>

components/gaoyia-parse/components/wxParseTemplate4.vue

@@ -0,0 +1,111 @@
+<template>
+  <!--判断是否是标签节点-->
+  <block v-if="node.node == 'element'">
+    <!--button类型-->
+    <button
+      v-if="node.tag == 'button'"
+      type="default"
+      size="mini"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <wx-parse-template :node="node" />
+    </button>
+
+    <!--a类型-->
+    <view
+      v-else-if="node.tag == 'a'"
+      @click="wxParseATap(node.attr, $event)"
+      :class="node.classStr"
+      :data-href="node.attr.href"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--li类型-->
+    <view
+      v-else-if="node.tag == 'li'"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--table类型-->
+    <wx-parse-table
+      v-else-if="node.tag == 'table'"
+      :class="node.classStr"
+      :style="node.styleStr"
+      :node="node"
+    />
+
+    <!--br类型-->
+    <!-- #ifndef H5 -->
+    <text v-else-if="node.tag == 'br'">\n</text>
+    <!-- #endif -->
+    <!-- #ifdef H5 -->
+    <br v-else-if="node.tag == 'br'" />
+    <!-- #endif -->
+
+    <!--video类型-->
+    <wx-parse-video :node="node" v-else-if="node.tag == 'video'" />
+
+    <!--audio类型-->
+    <wx-parse-audio :node="node" v-else-if="node.tag == 'audio'" />
+
+    <!--img类型-->
+    <wx-parse-img
+      :node="node"
+      v-else-if="node.tag == 'img'"
+      :style="node.styleStr"
+    />
+
+    <!--其他标签-->
+    <view v-else :class="node.classStr" :style="node.styleStr">
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+  </block>
+
+  <!--判断是否是文本节点-->
+  <block v-else-if="node.node == 'text'">{{ node.text }}</block>
+</template>
+
+<script>
+import wxParseTemplate from "./wxParseTemplate5";
+import wxParseImg from "./wxParseImg";
+import wxParseVideo from "./wxParseVideo";
+import wxParseAudio from "./wxParseAudio";
+import wxParseTable from "./wxParseTable";
+
+export default {
+  name: "wxParseTemplate4",
+  props: {
+    node: {},
+  },
+  components: {
+    wxParseTemplate,
+    wxParseImg,
+    wxParseVideo,
+    wxParseAudio,
+    wxParseTable,
+  },
+  methods: {
+    wxParseATap(attr, e) {
+      const { href } = e.currentTarget.dataset;
+      if (!href) return;
+      let parent = this.$parent;
+      while (!parent.preview || typeof parent.preview !== "function") {
+        parent = parent.$parent;
+      }
+      parent.navigate(href, e, attr);
+    },
+  },
+};
+</script>

components/gaoyia-parse/components/wxParseTemplate5.vue

@@ -0,0 +1,111 @@
+<template>
+  <!--判断是否是标签节点-->
+  <block v-if="node.node == 'element'">
+    <!--button类型-->
+    <button
+      v-if="node.tag == 'button'"
+      type="default"
+      size="mini"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <wx-parse-template :node="node" />
+    </button>
+
+    <!--a类型-->
+    <view
+      v-else-if="node.tag == 'a'"
+      @click="wxParseATap(node.attr, $event)"
+      :class="node.classStr"
+      :data-href="node.attr.href"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--li类型-->
+    <view
+      v-else-if="node.tag == 'li'"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--table类型-->
+    <wx-parse-table
+      v-else-if="node.tag == 'table'"
+      :class="node.classStr"
+      :style="node.styleStr"
+      :node="node"
+    />
+
+    <!--br类型-->
+    <!-- #ifndef H5 -->
+    <text v-else-if="node.tag == 'br'">\n</text>
+    <!-- #endif -->
+    <!-- #ifdef H5 -->
+    <br v-else-if="node.tag == 'br'" />
+    <!-- #endif -->
+
+    <!--video类型-->
+    <wx-parse-video :node="node" v-else-if="node.tag == 'video'" />
+
+    <!--audio类型-->
+    <wx-parse-audio :node="node" v-else-if="node.tag == 'audio'" />
+
+    <!--img类型-->
+    <wx-parse-img
+      :node="node"
+      v-else-if="node.tag == 'img'"
+      :style="node.styleStr"
+    />
+
+    <!--其他标签-->
+    <view v-else :class="node.classStr" :style="node.styleStr">
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+  </block>
+
+  <!--判断是否是文本节点-->
+  <block v-else-if="node.node == 'text'">{{ node.text }}</block>
+</template>
+
+<script>
+import wxParseTemplate from "./wxParseTemplate6";
+import wxParseImg from "./wxParseImg";
+import wxParseVideo from "./wxParseVideo";
+import wxParseAudio from "./wxParseAudio";
+import wxParseTable from "./wxParseTable";
+
+export default {
+  name: "wxParseTemplate5",
+  props: {
+    node: {},
+  },
+  components: {
+    wxParseTemplate,
+    wxParseImg,
+    wxParseVideo,
+    wxParseAudio,
+    wxParseTable,
+  },
+  methods: {
+    wxParseATap(attr, e) {
+      const { href } = e.currentTarget.dataset;
+      if (!href) return;
+      let parent = this.$parent;
+      while (!parent.preview || typeof parent.preview !== "function") {
+        parent = parent.$parent;
+      }
+      parent.navigate(href, e, attr);
+    },
+  },
+};
+</script>

components/gaoyia-parse/components/wxParseTemplate6.vue

@@ -0,0 +1,111 @@
+<template>
+  <!--判断是否是标签节点-->
+  <block v-if="node.node == 'element'">
+    <!--button类型-->
+    <button
+      v-if="node.tag == 'button'"
+      type="default"
+      size="mini"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <wx-parse-template :node="node" />
+    </button>
+
+    <!--a类型-->
+    <view
+      v-else-if="node.tag == 'a'"
+      @click="wxParseATap(node.attr, $event)"
+      :class="node.classStr"
+      :data-href="node.attr.href"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--li类型-->
+    <view
+      v-else-if="node.tag == 'li'"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--table类型-->
+    <wx-parse-table
+      v-else-if="node.tag == 'table'"
+      :class="node.classStr"
+      :style="node.styleStr"
+      :node="node"
+    />
+
+    <!--br类型-->
+    <!-- #ifndef H5 -->
+    <text v-else-if="node.tag == 'br'">\n</text>
+    <!-- #endif -->
+    <!-- #ifdef H5 -->
+    <br v-else-if="node.tag == 'br'" />
+    <!-- #endif -->
+
+    <!--video类型-->
+    <wx-parse-video :node="node" v-else-if="node.tag == 'video'" />
+
+    <!--audio类型-->
+    <wx-parse-audio :node="node" v-else-if="node.tag == 'audio'" />
+
+    <!--img类型-->
+    <wx-parse-img
+      :node="node"
+      v-else-if="node.tag == 'img'"
+      :style="node.styleStr"
+    />
+
+    <!--其他标签-->
+    <view v-else :class="node.classStr" :style="node.styleStr">
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+  </block>
+
+  <!--判断是否是文本节点-->
+  <block v-else-if="node.node == 'text'">{{ node.text }}</block>
+</template>
+
+<script>
+import wxParseTemplate from "./wxParseTemplate7";
+import wxParseImg from "./wxParseImg";
+import wxParseVideo from "./wxParseVideo";
+import wxParseAudio from "./wxParseAudio";
+import wxParseTable from "./wxParseTable";
+
+export default {
+  name: "wxParseTemplate6",
+  props: {
+    node: {},
+  },
+  components: {
+    wxParseTemplate,
+    wxParseImg,
+    wxParseVideo,
+    wxParseAudio,
+    wxParseTable,
+  },
+  methods: {
+    wxParseATap(attr, e) {
+      const { href } = e.currentTarget.dataset;
+      if (!href) return;
+      let parent = this.$parent;
+      while (!parent.preview || typeof parent.preview !== "function") {
+        parent = parent.$parent;
+      }
+      parent.navigate(href, e, attr);
+    },
+  },
+};
+</script>

components/gaoyia-parse/components/wxParseTemplate7.vue

@@ -0,0 +1,111 @@
+<template>
+  <!--判断是否是标签节点-->
+  <block v-if="node.node == 'element'">
+    <!--button类型-->
+    <button
+      v-if="node.tag == 'button'"
+      type="default"
+      size="mini"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <wx-parse-template :node="node" />
+    </button>
+
+    <!--a类型-->
+    <view
+      v-else-if="node.tag == 'a'"
+      @click="wxParseATap(node.attr, $event)"
+      :class="node.classStr"
+      :data-href="node.attr.href"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--li类型-->
+    <view
+      v-else-if="node.tag == 'li'"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--table类型-->
+    <wx-parse-table
+      v-else-if="node.tag == 'table'"
+      :class="node.classStr"
+      :style="node.styleStr"
+      :node="node"
+    />
+
+    <!--br类型-->
+    <!-- #ifndef H5 -->
+    <text v-else-if="node.tag == 'br'">\n</text>
+    <!-- #endif -->
+    <!-- #ifdef H5 -->
+    <br v-else-if="node.tag == 'br'" />
+    <!-- #endif -->
+
+    <!--video类型-->
+    <wx-parse-video :node="node" v-else-if="node.tag == 'video'" />
+
+    <!--audio类型-->
+    <wx-parse-audio :node="node" v-else-if="node.tag == 'audio'" />
+
+    <!--img类型-->
+    <wx-parse-img
+      :node="node"
+      v-else-if="node.tag == 'img'"
+      :style="node.styleStr"
+    />
+
+    <!--其他标签-->
+    <view v-else :class="node.classStr" :style="node.styleStr">
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+  </block>
+
+  <!--判断是否是文本节点-->
+  <block v-else-if="node.node == 'text'">{{ node.text }}</block>
+</template>
+
+<script>
+import wxParseTemplate from "./wxParseTemplate8";
+import wxParseImg from "./wxParseImg";
+import wxParseVideo from "./wxParseVideo";
+import wxParseAudio from "./wxParseAudio";
+import wxParseTable from "./wxParseTable";
+
+export default {
+  name: "wxParseTemplate7",
+  props: {
+    node: {},
+  },
+  components: {
+    wxParseTemplate,
+    wxParseImg,
+    wxParseVideo,
+    wxParseAudio,
+    wxParseTable,
+  },
+  methods: {
+    wxParseATap(attr, e) {
+      const { href } = e.currentTarget.dataset;
+      if (!href) return;
+      let parent = this.$parent;
+      while (!parent.preview || typeof parent.preview !== "function") {
+        parent = parent.$parent;
+      }
+      parent.navigate(href, e, attr);
+    },
+  },
+};
+</script>

components/gaoyia-parse/components/wxParseTemplate8.vue

@@ -0,0 +1,111 @@
+<template>
+  <!--判断是否是标签节点-->
+  <block v-if="node.node == 'element'">
+    <!--button类型-->
+    <button
+      v-if="node.tag == 'button'"
+      type="default"
+      size="mini"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <wx-parse-template :node="node" />
+    </button>
+
+    <!--a类型-->
+    <view
+      v-else-if="node.tag == 'a'"
+      @click="wxParseATap(node.attr, $event)"
+      :class="node.classStr"
+      :data-href="node.attr.href"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--li类型-->
+    <view
+      v-else-if="node.tag == 'li'"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--table类型-->
+    <wx-parse-table
+      v-else-if="node.tag == 'table'"
+      :class="node.classStr"
+      :style="node.styleStr"
+      :node="node"
+    />
+
+    <!--br类型-->
+    <!-- #ifndef H5 -->
+    <text v-else-if="node.tag == 'br'">\n</text>
+    <!-- #endif -->
+    <!-- #ifdef H5 -->
+    <br v-else-if="node.tag == 'br'" />
+    <!-- #endif -->
+
+    <!--video类型-->
+    <wx-parse-video :node="node" v-else-if="node.tag == 'video'" />
+
+    <!--audio类型-->
+    <wx-parse-audio :node="node" v-else-if="node.tag == 'audio'" />
+
+    <!--img类型-->
+    <wx-parse-img
+      :node="node"
+      v-else-if="node.tag == 'img'"
+      :style="node.styleStr"
+    />
+
+    <!--其他标签-->
+    <view v-else :class="node.classStr" :style="node.styleStr">
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+  </block>
+
+  <!--判断是否是文本节点-->
+  <block v-else-if="node.node == 'text'">{{ node.text }}</block>
+</template>
+
+<script>
+import wxParseTemplate from "./wxParseTemplate9";
+import wxParseImg from "./wxParseImg";
+import wxParseVideo from "./wxParseVideo";
+import wxParseAudio from "./wxParseAudio";
+import wxParseTable from "./wxParseTable";
+
+export default {
+  name: "wxParseTemplate8",
+  props: {
+    node: {},
+  },
+  components: {
+    wxParseTemplate,
+    wxParseImg,
+    wxParseVideo,
+    wxParseAudio,
+    wxParseTable,
+  },
+  methods: {
+    wxParseATap(attr, e) {
+      const { href } = e.currentTarget.dataset;
+      if (!href) return;
+      let parent = this.$parent;
+      while (!parent.preview || typeof parent.preview !== "function") {
+        parent = parent.$parent;
+      }
+      parent.navigate(href, e, attr);
+    },
+  },
+};
+</script>

components/gaoyia-parse/components/wxParseTemplate9.vue

@@ -0,0 +1,111 @@
+<template>
+  <!--判断是否是标签节点-->
+  <block v-if="node.node == 'element'">
+    <!--button类型-->
+    <button
+      v-if="node.tag == 'button'"
+      type="default"
+      size="mini"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <wx-parse-template :node="node" />
+    </button>
+
+    <!--a类型-->
+    <view
+      v-else-if="node.tag == 'a'"
+      @click="wxParseATap(node.attr, $event)"
+      :class="node.classStr"
+      :data-href="node.attr.href"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--li类型-->
+    <view
+      v-else-if="node.tag == 'li'"
+      :class="node.classStr"
+      :style="node.styleStr"
+    >
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+
+    <!--table类型-->
+    <wx-parse-table
+      v-else-if="node.tag == 'table'"
+      :class="node.classStr"
+      :style="node.styleStr"
+      :node="node"
+    />
+
+    <!--br类型-->
+    <!-- #ifndef H5 -->
+    <text v-else-if="node.tag == 'br'">\n</text>
+    <!-- #endif -->
+    <!-- #ifdef H5 -->
+    <br v-else-if="node.tag == 'br'" />
+    <!-- #endif -->
+
+    <!--video类型-->
+    <wx-parse-video :node="node" v-else-if="node.tag == 'video'" />
+
+    <!--audio类型-->
+    <wx-parse-audio :node="node" v-else-if="node.tag == 'audio'" />
+
+    <!--img类型-->
+    <wx-parse-img
+      :node="node"
+      v-else-if="node.tag == 'img'"
+      :style="node.styleStr"
+    />
+
+    <!--其他标签-->
+    <view v-else :class="node.classStr" :style="node.styleStr">
+      <block v-for="(node, index) of node.nodes" :key="index">
+        <wx-parse-template :node="node" />
+      </block>
+    </view>
+  </block>
+
+  <!--判断是否是文本节点-->
+  <block v-else-if="node.node == 'text'">{{ node.text }}</block>
+</template>
+
+<script>
+import wxParseTemplate from "./wxParseTemplate10";
+import wxParseImg from "./wxParseImg";
+import wxParseVideo from "./wxParseVideo";
+import wxParseAudio from "./wxParseAudio";
+import wxParseTable from "./wxParseTable";
+
+export default {
+  name: "wxParseTemplate9",
+  props: {
+    node: {},
+  },
+  components: {
+    wxParseTemplate,
+    wxParseImg,
+    wxParseVideo,
+    wxParseAudio,
+    wxParseTable,
+  },
+  methods: {
+    wxParseATap(attr, e) {
+      const { href } = e.currentTarget.dataset;
+      if (!href) return;
+      let parent = this.$parent;
+      while (!parent.preview || typeof parent.preview !== "function") {
+        parent = parent.$parent;
+      }
+      parent.navigate(href, e, attr);
+    },
+  },
+};
+</script>

components/gaoyia-parse/components/wxParseVideo.vue

@@ -0,0 +1,20 @@
+<template>
+  <!--增加video标签支持，并循环添加-->
+  <view :class="node.classStr" :style="node.styleStr">
+    <video
+      :class="node.classStr"
+      :style="node.styleStr"
+      class="video-video"
+      :src="node.attr.src"
+    ></video>
+  </view>
+</template>
+
+<script>
+export default {
+  name: "wxParseVideo",
+  props: {
+    node: {},
+  },
+};
+</script>