1

uni_modules/uview-next/components/u-parse/audio/audio.vue

@@ -0,0 +1,277 @@
+<template>
+	<view v-if="controls" @click="onClick" class="_contain">
+    <!-- 海报和按钮 -->
+		<view class="_poster" :style="'background-image:url('+poster+')'">
+			<view class="_button" @tap="_buttonTap">
+				<view :class="playing?'_pause':'_play'" />
+			</view>
+		</view>
+    <!-- 曲名和作者 -->
+		<view class="_title">
+			<view class="_name">{{name||'未知音频'}}</view>
+			<view class="_author">{{author||'未知作者'}}</view>
+		</view>
+    <!-- 进度条 -->
+    <slider class="_slider" activeColor="#585959" block-size="12" handle-size="12" :disabled="error" :value="value" @changing="_seeking" @change="_seeked" />
+    <!--播放时间-->
+		<view class="_time">{{time||'00:00'}}</view>
+	</view>
+</template>
+
+<script>
+/**
+ * @fileoverview audio 组件
+ */
+import context from './context'
+export default {
+  data () {
+    return {
+      error: false,
+      playing: false,
+      time: '00:00',
+      value: 0
+    }
+  },
+  props: {
+    aid: String,
+    name: String, // 音乐名
+    author: String, // 作者
+    poster: String, // 海报图片地址
+    autoplay: [Boolean, String], // 是否自动播放
+    controls: [Boolean, String], // 是否显示控件
+    loop: [Boolean, String], // 是否循环播放
+    src: String // 源地址
+  },
+  watch: {
+    src (src) {
+      this.setSrc(src)
+    }
+  },
+  mounted () {
+    this._ctx = uni.createInnerAudioContext()
+    this._ctx.onError((err) => {
+      this.error = true
+      this.$emit('error', err)
+    })
+    this._ctx.onTimeUpdate(() => {
+      const time = this._ctx.currentTime
+      const min = parseInt(time / 60)
+      const sec = Math.ceil(time % 60)
+      this.time = (min > 9 ? min : '0' + min) + ':' + (sec > 9 ? sec : '0' + sec)
+      if (!this.lastTime) {
+        this.value = time / this._ctx.duration * 100 // 不在拖动状态下
+      }
+    })
+    this._ctx.onEnded(() => {
+      if (!this.loop) {
+        this.playing = false
+      }
+    })
+    context.set(this.aid, this)
+    this.setSrc(this.src)
+  },
+  // #ifdef VUE2
+  beforeDestroy () {
+    this._ctx.destroy()
+    context.remove(this.aid)
+  },
+  // #endif
+  // #ifdef VUE3
+  beforeUnmount() {
+    this._ctx.destroy()
+    context.remove(this.aid)
+  },
+  // #endif
+  onPageShow () {
+    if (this.playing && this._ctx.paused) {
+      this._ctx.play()
+    }
+  },
+  methods: {
+    // 设置源
+    setSrc (src) {
+      this._ctx.autoplay = this.autoplay
+      this._ctx.loop = this.loop
+      this._ctx.src = src
+      if (this.autoplay && !this.playing) {
+        this.playing = true
+      }
+    },
+    // 播放
+    play () {
+      this._ctx.play()
+      this.playing = true
+      this.$emit('play', {
+        target: {
+          id: this.aid
+        }
+      })
+    },
+    // 暂停
+    pause () {
+      this._ctx.pause()
+      this.playing = false
+      this.$emit('pause')
+    },
+    // 设置播放速率
+    playbackRate (rate) {
+      this._ctx.playbackRate = rate
+    },
+    // 移动进度条
+    seek (sec) {
+      this._ctx.seek(sec)
+    },
+    // 内部方法
+    _buttonTap () {
+      if (this.playing) this.pause()
+      else this.play()
+    },
+    _seeking (e) {
+      // 避免过于频繁 setData
+      if (e.timeStamp - this.lastTime < 200) return
+      const time = Math.round(e.detail.value / 100 * this._ctx.duration)
+      const min = parseInt(time / 60)
+      const sec = time % 60
+      this.time = (min > 9 ? min : '0' + min) + ':' + (sec > 9 ? sec : '0' + sec)
+      this.lastTime = e.timeStamp
+    },
+    _seeked (e) {
+      this.seek(e.detail.value / 100 * this._ctx.duration)
+      this.lastTime = undefined
+    },
+    onClick(e) {
+      this.$emit('onClick', e)
+    }
+  }
+}
+</script>
+
+<style>
+/* 顶层容器 */
+._contain {
+  position: relative;
+  display: inline-flex;
+  width: 290px;
+  background-color: #fcfcfc;
+  border: 1px solid #e0e0e0;
+  border-radius: 2px;
+}
+
+/* 播放、暂停按钮 */
+._button {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 20px;
+  height: 20px;
+  overflow: hidden;
+  background-color: rgb(0, 0, 0, 0.2);
+  border: 1px solid white;
+  border-radius: 50%;
+  opacity: 0.9;
+}
+
+._play {
+  margin-left: 2px;
+  border-top: 4px solid transparent;
+  border-bottom: 4px solid transparent;
+  border-left: 8px solid white;
+}
+
+._pause {
+  width: 8px;
+  height: 8px;
+  background-color: white;
+}
+
+/* 海报 */
+._poster {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 70px;
+  height: 70px;
+  background-color: #e6e6e6;
+  background-size: contain;
+}
+
+/* 标题栏 */
+._title {
+  flex: 1;
+  margin: 4px 0 0 14px;
+  text-align: left;
+}
+
+._author {
+  width: 45px;
+  font-size: 12px;
+  color: #888;
+}
+
+._name {
+  width: 140px;
+  font-size: 15px;
+  line-height: 39px;
+}
+
+._author,
+._name {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+/* 进度条 */
+._slider {
+  position: absolute;
+  right: 16px;
+  bottom: 8px;
+  width: 140px;
+  margin: 0;
+}
+
+/* 播放时间 */
+._time {
+  margin: 7px 14px 0 0;
+  font-size: 12px;
+  color: #888;
+}
+
+/* 响应式布局，大屏幕用更大的尺寸 */
+@media (min-width: 400px) {
+  ._contain {
+    width: 380px;
+  }
+
+  ._button {
+    width: 26px;
+    height: 26px;
+  }
+
+  ._poster {
+    width: 90px;
+    height: 90px;
+  }
+
+  ._author {
+    width: 60px;
+    font-size: 15px;
+  }
+
+  ._name {
+    width: 180px;
+    font-size: 19px;
+    line-height: 55px;
+  }
+
+  ._slider {
+    right: 20px;
+    bottom: 10px;
+    width: 180px;
+  }
+
+  ._time {
+    font-size: 15px;
+  }
+}
+</style>

uni_modules/uview-next/components/u-parse/audio/context.js

@@ -0,0 +1,7 @@
+const ctx = {}
+
+export default {
+  get: id => ctx[id],
+  set: (id, vm) => { ctx[id] = vm },
+  remove: id => { ctx[id] = undefined }
+}

uni_modules/uview-next/components/u-parse/audio/index.js

@@ -0,0 +1,34 @@
+/**
+ * @fileoverview audio 插件
+ */
+import context from './context'
+let index = 0
+
+function Audio (vm) {
+  this.vm = vm
+}
+
+Audio.prototype.onUpdate = function () {
+  this.audios = []
+}
+
+Audio.prototype.onParse = function (node) {
+  if (node.name === 'audio') {
+    if (!node.attrs.id) {
+      node.attrs.id = 'a' + index++
+    }
+    this.audios.push(node.attrs.id)
+  }
+}
+
+Audio.prototype.onLoad = function () {
+  setTimeout(() => {
+    for (let i = 0; i < this.audios.length; i++) {
+      const ctx = context.get(this.audios[i])
+      ctx.id = this.audios[i]
+      this.vm._videos.push(ctx)
+    }
+  }, 500)
+}
+
+export default Audio

uni_modules/uview-next/components/u-parse/node/node.vue

@@ -0,0 +1,599 @@
+<template>
+  <view :id="attrs.id" :class="'_block _'+name+' '+attrs.class" :style="attrs.style">
+    <block v-for="(n, i) in childs" v-bind:key="i">
+      <!-- 图片 -->
+      <!-- 占位图 -->
+      <image v-if="n.name==='img'&&!n.t&&((opts[1]&&!ctrl[i])||ctrl[i]<0)" class="_img" :style="n.attrs.style" :src="ctrl[i]<0?opts[2]:opts[1]" mode="widthFix" />
+      <!-- 显示图片 -->
+      <!-- #ifdef H5 || (APP-PLUS && VUE2) -->
+      <img v-if="n.name==='img'" :id="n.attrs.id" :class="'_img '+n.attrs.class" :style="(ctrl[i]===-1?'display:none;':'')+n.attrs.style" :src="n.attrs.src||(ctrl.load?n.attrs['data-src']:'')" :data-i="i" @load="imgLoad" @error="mediaError" @tap.stop="imgTap" @longpress="imgLongTap" />
+      <!-- #endif -->
+      <!-- #ifndef H5 || (APP-PLUS && VUE2) -->
+      <!-- 表格中的图片，使用 rich-text 防止大小不正确 -->
+      <rich-text v-if="n.name==='img'&&n.t" :style="'display:'+n.t" :nodes="[{attrs:{style:n.attrs.style||'',src:n.attrs.src},name:'img'}]" :data-i="i" @tap.stop="imgTap" />
+      <!-- #endif -->
+      <!-- #ifdef APP-HARMONY -->
+      <image v-else-if="n.name==='img'" :id="n.attrs.id" :class="'_img '+n.attrs.class" :style="(ctrl[i]===-1?'display:none;':'')+'width:'+ctrl[i]+'px;'+n.attrs.style" :src="n.attrs.src||(ctrl.load?n.attrs['data-src']:'')" :mode="!n.h?'widthFix':(!n.w?'heightFix':(n.m||'scaleToFill'))" :data-i="i" @load="imgLoad" @error="mediaError" @tap.stop="imgTap" @longpress="imgLongTap" />
+      <!-- #endif -->
+      <!-- #ifndef H5 || APP-PLUS || MP-KUAISHOU -->
+      <image v-else-if="n.name==='img'" :id="n.attrs.id" :class="'_img '+n.attrs.class" :style="(ctrl[i]===-1?'display:none;':'')+'width:'+(ctrl[i]||1)+'px;height:1px;'+n.attrs.style" :src="n.attrs.src" :mode="!n.h?'widthFix':(!n.w?'heightFix':(n.m||'scaleToFill'))" :lazy-load="opts[0]" :webp="n.webp" :show-menu-by-longpress="opts[3]&&!n.attrs.ignore" :image-menu-prevent="!opts[3]||n.attrs.ignore" :data-i="i" @load="imgLoad" @error="mediaError" @tap.stop="imgTap" @longpress="imgLongTap" />
+      <!-- #endif -->
+      <!-- #ifdef MP-KUAISHOU -->
+      <image v-else-if="n.name==='img'" :id="n.attrs.id" :class="'_img '+n.attrs.class" :style="(ctrl[i]===-1?'display:none;':'')+n.attrs.style" :src="n.attrs.src" :lazy-load="opts[0]" :data-i="i" @load="imgLoad" @error="mediaError" @tap.stop="imgTap"></image>
+      <!-- #endif -->
+      <!-- #ifdef APP-PLUS && VUE3 -->
+      <image v-else-if="n.name==='img'" :id="n.attrs.id" :class="'_img '+n.attrs.class" :style="(ctrl[i]===-1?'display:none;':'')+'width:'+(ctrl[i]||1)+'px;'+n.attrs.style" :src="n.attrs.src||(ctrl.load?n.attrs['data-src']:'')" :mode="!n.h?'widthFix':(!n.w?'heightFix':(n.m||''))" :data-i="i" @load="imgLoad" @error="mediaError" @tap.stop="imgTap" @longpress="imgLongTap" />
+      <!-- #endif -->
+      <!-- 文本 -->
+      <!-- #ifdef MP-WEIXIN -->
+      <text v-else-if="n.text" :user-select="opts[4]=='force'&&isiOS" decode>{{n.text}}</text>
+      <!-- #endif -->
+      <!-- #ifndef MP-WEIXIN || MP-BAIDU || MP-ALIPAY || MP-TOUTIAO -->
+      <text v-else-if="n.text" decode>{{n.text}}</text>
+      <!-- #endif -->
+      <text v-else-if="n.name==='br'">{{'\n'}}</text>
+      <!-- 链接 -->
+      <view v-else-if="n.name==='a'" :id="n.attrs.id" :class="(n.attrs.href?'_a ':'')+n.attrs.class" hover-class="_hover" :style="'display:inline;'+n.attrs.style" :data-i="i" @tap.stop="linkTap">
+        <node name="span" :childs="n.children" :opts="opts" style="display:inherit" />
+      </view>
+      <!-- 视频 -->
+      <!-- #ifdef APP-PLUS -->
+      <view v-else-if="n.html" :id="n.attrs.id" :class="'_video '+n.attrs.class" :style="n.attrs.style" v-html="n.html" :data-i="i" @vplay.stop="play" />
+      <!-- #endif -->
+      <!-- #ifndef APP-PLUS -->
+      <video v-else-if="n.name==='video'" :id="n.attrs.id" :class="n.attrs.class" :style="n.attrs.style" :autoplay="n.attrs.autoplay" :controls="n.attrs.controls" :loop="n.attrs.loop" :muted="n.attrs.muted" :object-fit="n.attrs['object-fit']" :poster="n.attrs.poster" :src="n.src[ctrl[i]||0]" :data-i="i" @play="play" @error="mediaError" />
+      <!-- #endif -->
+      <!-- #ifdef H5 || APP-PLUS -->
+      <iframe v-else-if="n.name==='iframe'" :style="n.attrs.style" :allowfullscreen="n.attrs.allowfullscreen" :frameborder="n.attrs.frameborder" :src="n.attrs.src" />
+      <embed v-else-if="n.name==='embed'" :style="n.attrs.style" :src="n.attrs.src" />
+      <!-- #endif -->
+      <!-- #ifndef MP-TOUTIAO || ((H5 || APP-PLUS) && VUE3) -->
+      <!-- 音频 -->
+      <audio v-else-if="n.name==='audio'" :id="n.attrs.id" :class="n.attrs.class" :style="n.attrs.style" :author="n.attrs.author" :controls="n.attrs.controls" :loop="n.attrs.loop" :name="n.attrs.name" :poster="n.attrs.poster" :src="n.src[ctrl[i]||0]" :data-i="i" @play="play" @error="mediaError" />
+      <!-- #endif -->
+      <view v-else-if="(n.name==='table'&&n.c)||n.name==='li'" :id="n.attrs.id" :class="'_'+n.name+' '+n.attrs.class" :style="n.attrs.style">
+        <node v-if="n.name==='li'" :childs="n.children" :opts="opts" />
+        <view v-else v-for="(tbody, x) in n.children" v-bind:key="x" :class="'_'+tbody.name+' '+tbody.attrs.class" :style="tbody.attrs.style">
+          <node v-if="tbody.name==='td'||tbody.name==='th'" :childs="tbody.children" :opts="opts" />
+          <block v-else v-for="(tr, y) in tbody.children" v-bind:key="y">
+            <view v-if="tr.name==='td'||tr.name==='th'" :class="'_'+tr.name+' '+tr.attrs.class" :style="tr.attrs.style">
+              <node :childs="tr.children" :opts="opts" />
+            </view>
+            <view v-else :class="'_'+tr.name+' '+tr.attrs.class" :style="tr.attrs.style">
+              <view v-for="(td, z) in tr.children" v-bind:key="z" :class="'_'+td.name+' '+td.attrs.class" :style="td.attrs.style">
+                <node :childs="td.children" :opts="opts" />
+              </view>
+            </view>
+          </block>
+        </view>
+      </view>
+      <!-- insert -->
+      <!-- 富文本 -->
+      <!-- #ifdef H5 || ((MP-WEIXIN || MP-QQ || APP-PLUS || MP-360) && VUE2) -->
+      <rich-text v-else-if="!n.c&&!handler.isInline(n.name, n.attrs.style)" :id="n.attrs.id" :style="n.f" :user-select="opts[4]" :nodes="[n]" />
+      <!-- #endif -->
+      <!-- #ifndef H5 || ((MP-WEIXIN || MP-QQ || APP-PLUS || MP-360) && VUE2) -->
+      <rich-text v-else-if="!n.c" :id="n.attrs.id" :style="'display:inline;'+n.f" :preview="false" :selectable="opts[4]" :user-select="opts[4]" :nodes="[n]" />
+      <!-- #endif -->
+      <!-- 继续递归 -->
+      <view v-else-if="n.c===2" :id="n.attrs.id" :class="'_block _'+n.name+' '+n.attrs.class" :style="n.f+';'+n.attrs.style">
+        <node v-for="(n2, j) in n.children" v-bind:key="j" :style="n2.f" :name="n2.name" :attrs="n2.attrs" :childs="n2.children" :opts="opts" />
+      </view>
+      <node v-else :style="n.f" :name="n.name" :attrs="n.attrs" :childs="n.children" :opts="opts" />
+    </block>
+  </view>
+</template>
+<script module="handler" lang="wxs">
+// 行内标签列表
+var inlineTags = {
+  abbr: true,
+  b: true,
+  big: true,
+  code: true,
+  del: true,
+  em: true,
+  i: true,
+  ins: true,
+  label: true,
+  q: true,
+  small: true,
+  span: true,
+  strong: true,
+  sub: true,
+  sup: true
+}
+/**
+ * @description 判断是否为行内标签
+ */
+module.exports = {
+  isInline: function (tagName, style) {
+    return inlineTags[tagName] || (style || '').indexOf('display:inline') !== -1
+  }
+}
+</script>
+<script>
+import node from './node'
+export default {
+  name: 'node',
+  options: {
+    // #ifdef MP-WEIXIN
+    virtualHost: true,
+    // #endif
+    // #ifdef MP-TOUTIAO
+    addGlobalClass: false
+    // #endif
+  },
+  data () {
+    return {
+      ctrl: {},
+      // #ifdef MP-WEIXIN
+      isiOS: uni.$u.os() === 'ios'
+      // #endif
+    }
+  },
+  props: {
+    name: String,
+    attrs: {
+      type: Object,
+      default () {
+        return {}
+      }
+    },
+    childs: Array,
+    opts: Array
+  },
+  components: {
+    // #ifndef ((H5 || APP-PLUS) && VUE3) || APP-HARMONY
+    node
+    // #endif
+  },
+  mounted () {
+    this.$nextTick(() => {
+      for (this.root = this.$parent; this.root.$options.name !== 'u-parse'; this.root = this.root.$parent);
+    })
+    // #ifdef H5 || APP-PLUS
+    if (this.opts[0]) {
+      let i
+      for (i = this.childs.length; i--;) {
+        if (this.childs[i].name === 'img') break
+      }
+      if (i !== -1) {
+        this.observer = uni.createIntersectionObserver(this).relativeToViewport({
+          top: 500,
+          bottom: 500
+        })
+        this.observer.observe('._img', res => {
+          if (res.intersectionRatio) {
+            this.$set(this.ctrl, 'load', 1)
+            this.observer.disconnect()
+          }
+        })
+      }
+    }
+    // #endif
+  },
+  beforeDestroy () {
+    // #ifdef H5 || APP-PLUS
+    if (this.observer) {
+      this.observer.disconnect()
+    }
+    // #endif
+  },
+  methods: {
+    // #ifdef MP-WEIXIN
+    toJSON () { return this },
+    // #endif
+    /**
+     * @description 播放视频事件
+     * @param {Event} e
+     */
+    play (e) {
+      const i = e.currentTarget.dataset.i
+      const node = this.childs[i]
+      this.root.$emit('play', {
+        source: node.name,
+        attrs: {
+          ...node.attrs,
+          src: node.src[this.ctrl[i] || 0]
+        }
+      })
+      // #ifndef APP-PLUS
+      if (this.root.pauseVideo) {
+        let flag = false
+        const id = e.target.id
+        for (let i = this.root._videos.length; i--;) {
+          if (this.root._videos[i].id === id) {
+            flag = true
+          } else {
+            this.root._videos[i].pause() // 自动暂停其他视频
+          }
+        }
+        // 将自己加入列表
+        if (!flag) {
+          const ctx = uni.createVideoContext(id
+            // #ifndef MP-BAIDU
+            , this
+            // #endif
+          )
+          ctx.id = id
+          if (this.root.playbackRate) {
+            ctx.playbackRate(this.root.playbackRate)
+          }
+          this.root._videos.push(ctx)
+        }
+      }
+      // #endif
+    },
+
+    /**
+     * @description 图片点击事件
+     * @param {Event} e
+     */
+    imgTap (e) {
+      const node = this.childs[e.currentTarget.dataset.i]
+      if (node.a) {
+        this.linkTap(node.a)
+        return
+      }
+      if (node.attrs.ignore) return
+      // #ifdef H5 || APP-PLUS
+      node.attrs.src = node.attrs.src || node.attrs['data-src']
+      // #endif
+      // #ifndef APP-HARMONY
+      this.root.$emit('imgtap', node.attrs)
+      // #endif
+      // #ifdef APP-HARMONY
+      this.root.$emit('imgtap', {
+        ...node.attrs
+      })
+      // #endif
+      // 自动预览图片
+      if (this.root.previewImg) {
+        uni.previewImage({
+          // #ifdef MP-WEIXIN
+          showmenu: this.root.showImgMenu,
+          // #endif
+          // #ifdef MP-ALIPAY
+          enablesavephoto: this.root.showImgMenu,
+          enableShowPhotoDownload: this.root.showImgMenu,
+          // #endif
+          current: parseInt(node.attrs.i),
+          urls: this.root.imgList
+        })
+      }
+    },
+
+    /**
+     * @description 图片长按
+     */
+    imgLongTap (e) {
+      // #ifdef APP-PLUS
+      const attrs = this.childs[e.currentTarget.dataset.i].attrs
+      if (this.opts[3] && !attrs.ignore) {
+        uni.showActionSheet({
+          itemList: ['保存图片'],
+          success: () => {
+            const save = path => {
+              uni.saveImageToPhotosAlbum({
+                filePath: path,
+                success () {
+                  uni.showToast({
+                    title: '保存成功'
+                  })
+                }
+              })
+            }
+            if (this.root.imgList[attrs.i].startsWith('http')) {
+              uni.downloadFile({
+                url: this.root.imgList[attrs.i],
+                success: res => save(res.tempFilePath)
+              })
+            } else {
+              save(this.root.imgList[attrs.i])
+            }
+          }
+        })
+      }
+      // #endif
+    },
+
+    /**
+     * @description 图片加载完成事件
+     * @param {Event} e
+     */
+    imgLoad (e) {
+      const i = e.currentTarget.dataset.i
+      /* #ifndef H5 || (APP-PLUS && VUE2) */
+      if (!this.childs[i].w) {
+        // 设置原宽度
+        this.$set(this.ctrl, i, e.detail.width)
+      } else /* #endif */ if ((this.opts[1] && !this.ctrl[i]) || this.ctrl[i] === -1) {
+        // 加载完毕，取消加载中占位图
+        this.$set(this.ctrl, i, 1)
+      }
+      this.checkReady()
+    },
+
+    /**
+     * @description 检查是否所有图片加载完毕
+     */
+    checkReady () {
+      if (this.root && !this.root.lazyLoad) {
+        this.root._unloadimgs -= 1
+        if (!this.root._unloadimgs) {
+          setTimeout(() => {
+            this.root.getRect().then(rect => {
+              this.root.$emit('ready', rect)
+            }).catch(() => {
+              this.root.$emit('ready', {})
+            })
+          }, 350)
+        }
+      }
+    },
+
+    /**
+     * @description 链接点击事件
+     * @param {Event} e
+     */
+    linkTap (e) {
+      const node = e.currentTarget ? this.childs[e.currentTarget.dataset.i] : {}
+      const attrs = node.attrs || e
+      const href = attrs.href
+      this.root.$emit('linktap', Object.assign({
+        innerText: this.root.getText(node.children || []) // 链接内的文本内容
+      }, attrs))
+      if (href) {
+       
+        if (href[0] === '#') {
+          // 跳转锚点
+          this.root.navigateTo(href.substring(1)).catch(() => { })
+        } else if (href.split('?')[0].includes('://')) {
+          // 复制外部链接
+          if (this.root.copyLink) {
+            // #ifdef H5
+            window.open(href)
+            // #endif
+            // #ifdef MP
+            uni.setClipboardData({
+              data: href,
+              success: () =>
+                uni.showToast({
+                  title: '链接已复制'
+                })
+            })
+            // #endif
+            // #ifdef APP-PLUS
+            plus.runtime.openWeb(href)
+            // #endif
+            // #ifdef APP-HARMONY
+            plus.runtime.openURL(href)
+            // #endif
+          }
+        } else {
+          // 跳转页面
+          uni.navigateTo({
+            url: href,
+            fail () {
+              uni.switchTab({
+                url: href,
+                fail () { }
+              })
+            }
+          })
+        }
+      }
+    },
+
+    /**
+     * @description 错误事件
+     * @param {Event} e
+     */
+    mediaError (e) {
+      const i = e.currentTarget.dataset.i
+      const node = this.childs[i]
+      // 加载其他源
+      if (node.name === 'video' || node.name === 'audio') {
+        let index = (this.ctrl[i] || 0) + 1
+        if (index > node.src.length) {
+          index = 0
+        }
+        if (index < node.src.length) {
+          this.$set(this.ctrl, i, index)
+          return
+        }
+      } else if (node.name === 'img') {
+        // #ifdef H5 && VUE3
+        if (this.opts[0] && !this.ctrl.load) return
+        // #endif
+        // 显示错误占位图
+        if (this.opts[2]) {
+          this.$set(this.ctrl, i, -1)
+        }
+        this.checkReady()
+      }
+      if (this.root) {
+        this.root.$emit('error', {
+          source: node.name,
+          attrs: node.attrs,
+          // #ifndef H5 && VUE3
+          errMsg: e.detail.errMsg
+          // #endif
+        })
+      }
+    }
+  }
+}
+</script>
+<style>
+/* a 标签默认效果 */
+._a {
+  padding: 1.5px 0 1.5px 0;
+  color: #366092;
+  word-break: break-all;
+}
+
+/* a 标签点击态效果 */
+._hover {
+  text-decoration: underline;
+  opacity: 0.7;
+}
+
+/* 图片默认效果 */
+._img {
+  max-width: 100%;
+  -webkit-touch-callout: none;
+}
+
+/* 内部样式 */
+
+._block {
+  display: block;
+}
+
+._b,
+._strong {
+  font-weight: bold;
+}
+
+._code {
+  font-family: monospace;
+}
+
+._del {
+  text-decoration: line-through;
+}
+
+._em,
+._i {
+  font-style: italic;
+}
+
+._h1 {
+  font-size: 2em;
+}
+
+._h2 {
+  font-size: 1.5em;
+}
+
+._h3 {
+  font-size: 1.17em;
+}
+
+._h5 {
+  font-size: 0.83em;
+}
+
+._h6 {
+  font-size: 0.67em;
+}
+
+._h1,
+._h2,
+._h3,
+._h4,
+._h5,
+._h6 {
+  display: block;
+  font-weight: bold;
+}
+
+._image {
+  height: 1px;
+}
+
+._ins {
+  text-decoration: underline;
+}
+
+._li {
+  display: list-item;
+}
+
+._ol {
+  list-style-type: decimal;
+}
+
+._ol,
+._ul {
+  display: block;
+  padding-left: 40px;
+  margin: 1em 0;
+}
+
+._q::before {
+  content: '"';
+}
+
+._q::after {
+  content: '"';
+}
+
+._sub {
+  font-size: smaller;
+  vertical-align: sub;
+}
+
+._sup {
+  font-size: smaller;
+  vertical-align: super;
+}
+
+._thead,
+._tbody,
+._tfoot {
+  display: table-row-group;
+}
+
+._tr {
+  display: table-row;
+}
+
+._td,
+._th {
+  display: table-cell;
+  vertical-align: middle;
+}
+
+._th {
+  font-weight: bold;
+  text-align: center;
+}
+
+._ul {
+  list-style-type: disc;
+}
+
+._ul ._ul {
+  margin: 0;
+  list-style-type: circle;
+}
+
+._ul ._ul ._ul {
+  list-style-type: square;
+}
+
+._abbr,
+._b,
+._code,
+._del,
+._em,
+._i,
+._ins,
+._label,
+._q,
+._span,
+._strong,
+._sub,
+._sup {
+  display: inline;
+}
+
+/* #ifdef APP-PLUS */
+._video {
+  width: 300px;
+  height: 225px;
+}
+/* #endif */
+</style>

uni_modules/uview-next/components/u-parse/props.js

@@ -0,0 +1,70 @@
+export default {
+    props: {
+        // #ifdef APP-PLUS-NVUE
+        bgColor: {
+            type: String,
+            default: ()=> uni.$u.props.parse.bgColor
+        },
+        // #endif
+        containerStyle: {
+			type: String,
+			default: ()=> uni.$u.props.parse.containerStyle
+		},
+		content: {
+			type: String,
+			default: ()=> uni.$u.props.parse.content
+		},
+        copyLink: {
+		  type: Boolean,
+		  default: ()=> uni.$u.props.parse.copyLink
+        },
+        domain: {
+            type: String,
+            default: ()=> uni.$u.props.parse.domain
+        },
+        errorImg: {
+		  type: String,
+		  default: ()=> uni.$u.props.parse.errorImg
+        },
+        lazyLoad: {
+		  type: Boolean,
+		  default: ()=> uni.$u.props.parse.lazyLoad
+        },
+        loadingImg: {
+		  type: String,
+		  default: ()=> uni.$u.props.parse.loadingImg
+        },
+        pauseVideo: {
+		  type: Boolean,
+		  default: ()=> uni.$u.props.parse.pauseVideo
+        },
+        previewImg: {
+		  type: Boolean,
+		  default: ()=> uni.$u.props.parse.previewImg
+        },
+        scrollTable: {
+            type: Boolean,
+            default: ()=> uni.$u.props.parse.scrollTable
+        },
+        selectable: {
+            type: Boolean,
+            default: ()=> uni.$u.props.parse.selectable
+        },
+        setTitle: {
+		  type: Boolean,
+		  default: ()=> uni.$u.props.parse.setTitle
+        },
+        showImgMenu: {
+		  type: Boolean,
+		  default: ()=> uni.$u.props.parse.showImgMenu
+        },
+        tagStyle: {
+            type: Object,
+            default: ()=> uni.$u.props.parse.tagStyle
+        },
+        useAnchor: {
+            type: [Boolean, Number],
+            default: ()=> uni.$u.props.parse.useAnchor
+        }
+	}
+}

uni_modules/uview-next/components/u-parse/style/index.js

@@ -0,0 +1,129 @@
+/**
+ * @fileoverview style 插件
+ */
+// #ifndef APP-PLUS-NVUE
+import Parser from './parser'
+// #endif
+
+function Style () {
+  this.styles = []
+}
+
+// #ifndef APP-PLUS-NVUE
+Style.prototype.onParse = function (node, vm) {
+  // 获取样式
+  if (node.name === 'style' && node.children.length && node.children[0].type === 'text') {
+    this.styles = this.styles.concat(new Parser().parse(node.children[0].text))
+  } else if (node.name) {
+    // 匹配样式（对非文本标签）
+    // 存储不同优先级的样式 name < class < id < 后代
+    let matched = ['', '', '', '']
+    for (let i = 0, len = this.styles.length; i < len; i++) {
+      const item = this.styles[i]
+      let res = match(node, item.key || item.list[item.list.length - 1])
+      let j
+      if (res) {
+        // 后代选择器
+        if (!item.key) {
+          j = item.list.length - 2
+          for (let k = vm.stack.length; j >= 0 && k--;) {
+            // 子选择器
+            if (item.list[j] === '>') {
+              // 错误情况
+              if (j < 1 || j > item.list.length - 2) break
+              if (match(vm.stack[k], item.list[j - 1])) {
+                j -= 2
+              } else {
+                j++
+              }
+            } else if (match(vm.stack[k], item.list[j])) {
+              j--
+            }
+          }
+          res = 4
+        }
+        if (item.key || j < 0) {
+          // 添加伪类
+          if (item.pseudo && node.children) {
+            let text
+            item.style = item.style.replace(/content:([^;]+)/, (_, $1) => {
+              text = $1.replace(/['"]/g, '')
+                // 处理 attr 函数
+                .replace(/attr\((.+?)\)/, (_, $1) => node.attrs[$1.trim()] || '')
+                // 编码 \xxx
+                .replace(/\\(\w{4})/, (_, $1) => String.fromCharCode(parseInt($1, 16)))
+              return ''
+            })
+            const pseudo = {
+              name: 'span',
+              attrs: {
+                style: item.style
+              },
+              children: [{
+                type: 'text',
+                text
+              }]
+            }
+            if (item.pseudo === 'before') {
+              node.children.unshift(pseudo)
+            } else {
+              node.children.push(pseudo)
+            }
+          } else {
+            matched[res - 1] += item.style + (item.style[item.style.length - 1] === ';' ? '' : ';')
+          }
+        }
+      }
+    }
+    matched = matched.join('')
+    if (matched.length > 2) {
+      node.attrs.style = matched + (node.attrs.style || '')
+    }
+  }
+}
+
+/**
+ * @description 匹配样式
+ * @param {object} node 要匹配的标签
+ * @param {string|string[]} keys 选择器
+ * @returns {number} 0：不匹配；1：name 匹配；2：class 匹配；3：id 匹配
+ */
+function match (node, keys) {
+  function matchItem (key) {
+    if (key[0] === '#') {
+      // 匹配 id
+      if (node.attrs.id && node.attrs.id.trim() === key.substr(1)) return 3
+    } else if (key[0] === '.') {
+      // 匹配 class
+      key = key.substr(1)
+      const selectors = (node.attrs.class || '').split(' ')
+      for (let i = 0; i < selectors.length; i++) {
+        if (selectors[i].trim() === key) return 2
+      }
+    } else if (node.name === key) {
+      // 匹配 name
+      return 1
+    }
+    return 0
+  }
+
+  // 多选择器交集
+  if (keys instanceof Array) {
+    let res = 0
+    for (let j = 0; j < keys.length; j++) {
+      const tmp = matchItem(keys[j])
+      // 任意一个不匹配就失败
+      if (!tmp) return 0
+      // 优先级最大的一个作为最终优先级
+      if (tmp > res) {
+        res = tmp
+      }
+    }
+    return res
+  }
+
+  return matchItem(keys)
+}
+// #endif
+
+export default Style

uni_modules/uview-next/components/u-parse/style/parser.js

@@ -0,0 +1,175 @@
+const blank = {
+  ' ': true,
+  '\n': true,
+  '\t': true,
+  '\r': true,
+  '\f': true
+}
+
+function Parser () {
+  this.styles = []
+  this.selectors = []
+}
+
+/**
+ * @description 解析 css 字符串
+ * @param {string} content css 内容
+ */
+Parser.prototype.parse = function (content) {
+  new Lexer(this).parse(content)
+  return this.styles
+}
+
+/**
+ * @description 解析到一个选择器
+ * @param {string} name 名称
+ */
+Parser.prototype.onSelector = function (name) {
+  // 不支持的选择器
+  if (name.includes('[') || name.includes('*') || name.includes('@')) return
+  const selector = {}
+  // 伪类
+  if (name.includes(':')) {
+    const info = name.split(':')
+    const pseudo = info.pop()
+    if (pseudo === 'before' || pseudo === 'after') {
+      selector.pseudo = pseudo
+      name = info[0]
+    } else return
+  }
+
+  // 分割交集选择器
+  function splitItem (str) {
+    const arr = []
+    let i, start
+    for (i = 1, start = 0; i < str.length; i++) {
+      if (str[i] === '.' || str[i] === '#') {
+        arr.push(str.substring(start, i))
+        start = i
+      }
+    }
+    if (!arr.length) {
+      return str
+    } else {
+      arr.push(str.substring(start, i))
+      return arr
+    }
+  }
+
+  // 后代选择器
+  if (name.includes(' ')) {
+    selector.list = []
+    const list = name.split(' ')
+    for (let i = 0; i < list.length; i++) {
+      if (list[i].length) {
+        // 拆分子选择器
+        const arr = list[i].split('>')
+        for (let j = 0; j < arr.length; j++) {
+          selector.list.push(splitItem(arr[j]))
+          if (j < arr.length - 1) {
+            selector.list.push('>')
+          }
+        }
+      }
+    }
+  } else {
+    selector.key = splitItem(name)
+  }
+
+  this.selectors.push(selector)
+}
+
+/**
+ * @description 解析到选择器内容
+ * @param {string} content 内容
+ */
+Parser.prototype.onContent = function (content) {
+  // 并集选择器
+  for (let i = 0; i < this.selectors.length; i++) {
+    this.selectors[i].style = content
+  }
+  this.styles = this.styles.concat(this.selectors)
+  this.selectors = []
+}
+
+/**
+ * @description css 词法分析器
+ * @param {object} handler 高层处理器
+ */
+function Lexer (handler) {
+  this.selector = ''
+  this.style = ''
+  this.handler = handler
+}
+
+Lexer.prototype.parse = function (content) {
+  this.i = 0
+  this.content = content
+  this.state = this.blank
+  for (let len = content.length; this.i < len; this.i++) {
+    this.state(content[this.i])
+  }
+}
+
+Lexer.prototype.comment = function () {
+  this.i = this.content.indexOf('*/', this.i) + 1
+  if (!this.i) {
+    this.i = this.content.length
+  }
+}
+
+Lexer.prototype.blank = function (c) {
+  if (!blank[c]) {
+    if (c === '/' && this.content[this.i + 1] === '*') {
+      this.comment()
+      return
+    }
+    this.selector += c
+    this.state = this.name
+  }
+}
+
+Lexer.prototype.name = function (c) {
+  if (c === '/' && this.content[this.i + 1] === '*') {
+    this.comment()
+    return
+  }
+  if (c === '{' || c === ',' || c === ';') {
+    this.handler.onSelector(this.selector.trimEnd())
+    this.selector = ''
+    if (c !== '{') {
+      while (blank[this.content[++this.i]]);
+    }
+    if (this.content[this.i] === '{') {
+      this.floor = 1
+      this.state = this.val
+    } else {
+      this.selector += this.content[this.i]
+    }
+  } else if (blank[c]) {
+    this.selector += ' '
+  } else {
+    this.selector += c
+  }
+}
+
+Lexer.prototype.val = function (c) {
+  if (c === '/' && this.content[this.i + 1] === '*') {
+    this.comment()
+    return
+  }
+  if (c === '{') {
+    this.floor++
+  } else if (c === '}') {
+    this.floor--
+    if (!this.floor) {
+      this.handler.onContent(this.style)
+      this.style = ''
+      this.state = this.blank
+      return
+    }
+  }
+  this.style += c
+}
+
+export default Parser

uni_modules/uview-next/components/u-parse/u-parse.vue

@@ -0,0 +1,479 @@
+<template>
+	<view id="_root" :class="(selectable ? '_select ' : '') + '_root'" :style="containerStyle">
+		<slot v-if="!nodes[0]" />
+		<!-- #ifndef APP-PLUS-NVUE -->
+		<node v-else :childs="nodes" :opts="[lazyLoad, loadingImg, errorImg, showImgMenu, selectable]" name="span" />
+		<!-- #endif -->
+		<!-- #ifdef APP-PLUS-NVUE -->
+		<web-view ref="web" src="/static/app-plus/mp-html/local.html" :style="'margin-top:-2px;height:' + height + 'px'"
+			@onPostMessage="_onMessage" />
+		<!-- #endif -->
+	</view>
+</template>
+
+<script>
+/**
+ * mp-html v2.5.1
+ * @description 富文本组件
+ * @tutorial https://github.com/jin-yufeng/mp-html
+ * @property {String} container-style 容器的样式
+ * @property {String} content 用于渲染的 html 字符串
+ * @property {Boolean} copy-link 是否允许外部链接被点击时自动复制
+ * @property {String} domain 主域名，用于拼接链接
+ * @property {String} error-img 图片出错时的占位图链接
+ * @property {Boolean} lazy-load 是否开启图片懒加载
+ * @property {string} loading-img 图片加载过程中的占位图链接
+ * @property {Boolean} pause-video 是否在播放一个视频时自动暂停其他视频
+ * @property {Boolean} preview-img 是否允许图片被点击时自动预览
+ * @property {Boolean} scroll-table 是否给每个表格添加一个滚动层使其能单独横向滚动
+ * @property {Boolean | String} selectable 是否开启长按复制
+ * @property {Boolean} set-title 是否将 title 标签的内容设置到页面标题
+ * @property {Boolean} show-img-menu 是否允许图片被长按时显示菜单
+ * @property {Object} tag-style 标签的默认样式
+ * @property {Boolean | Number} use-anchor 是否使用锚点链接
+ * @event {Function} load dom 结构加载完毕时触发
+ * @event {Function} ready 所有图片加载完毕时触发
+ * @event {Function} imgtap 图片被点击时触发
+ * @event {Function} linktap 链接被点击时触发
+ * @event {Function} play 音视频播放时触发
+ * @event {Function} error 媒体加载出错时触发
+ */
+// #ifndef APP-PLUS-NVUE
+import node from './node/node'
+// #endif
+import props from './props.js';
+	import mixin from '../../libs/mixin/mixin'
+	import mpMixin from '../../libs/mixin/mpMixin'
+import Parser from './parser'
+import audio from './audio/index.js'
+import style from './style/index.js'
+
+const plugins=[audio,style]
+
+// #ifdef APP-PLUS-NVUE
+const dom = weex.requireModule('dom')
+// #endif
+export default {
+	name: 'u-parse',
+	data() {
+		return {
+			plugins: [],
+			nodes: [],
+			// #ifdef APP-PLUS-NVUE
+			height: 3
+			// #endif
+		}
+	},
+	mixins: [mpMixin, mixin, props],
+	// #ifdef VUE3
+	emits: ['load', 'ready', 'imgtap', 'linktap', 'play', 'error'],
+	// #endif
+	// #ifndef APP-PLUS-NVUE
+	components: {
+		node
+	},
+	// #endif
+	watch: {
+		content(content) {
+			this.setContent(content)
+		}
+	},
+	created() {
+		for (let i = plugins.length; i--;) {
+			this.plugins.push(new plugins[i](this))
+		}
+	},
+	mounted() {
+		if (this.content && !this.nodes.length) {
+			this.setContent(this.content)
+		}
+	},
+	// #ifdef VUE2
+	beforeDestroy() {
+		this._hook('onDetached')
+	},
+	// #endif
+	// #ifdef VUE3
+	beforeUnmount() {
+		this._hook('onDetached')
+	},
+	// #endif
+
+	methods: {
+		/**
+		 * @description 将锚点跳转的范围限定在一个 scroll-view 内
+		 * @param {Object} page scroll-view 所在页面的示例
+		 * @param {String} selector scroll-view 的选择器
+		 * @param {String} scrollTop scroll-view scroll-top 属性绑定的变量名
+		 */
+		in(page, selector, scrollTop) {
+			// #ifndef APP-PLUS-NVUE
+			if (page && selector && scrollTop) {
+				this._in = {
+					page,
+					selector,
+					scrollTop
+				}
+			}
+			// #endif
+		},
+
+		/**
+		 * @description 锚点跳转
+		 * @param {String} id 要跳转的锚点 id
+		 * @param {Number} offset 跳转位置的偏移量
+		 * @returns {Promise}
+		 */
+		navigateTo(id, offset) {
+			return new Promise((resolve, reject) => {
+				if (!this.useAnchor) {
+					reject(Error('Anchor is disabled'))
+					return
+				}
+				offset = offset || parseInt(this.useAnchor) || 0
+				// #ifdef APP-PLUS-NVUE
+				if (!id) {
+					dom.scrollToElement(this.$refs.web, {
+						offset
+					})
+					resolve()
+				} else {
+					this._navigateTo = {
+						resolve,
+						reject,
+						offset
+					}
+					this.$refs.web.evalJs('uni.postMessage({data:{action:"getOffset",offset:(document.getElementById(' + id + ')||{}).offsetTop}})')
+				}
+				// #endif
+				// #ifndef APP-PLUS-NVUE
+				let deep = ' '
+				// #ifdef MP-WEIXIN || MP-QQ || MP-TOUTIAO
+				deep = '>>>'
+				// #endif
+				const selector = uni.createSelectorQuery()
+					// #ifndef MP-ALIPAY
+					.in(this._in ? this._in.page : this)
+					// #endif
+					.select((this._in ? this._in.selector : '._root') + (id ? `${deep}#${id}` : '')).boundingClientRect()
+				if (this._in) {
+					selector.select(this._in.selector).scrollOffset()
+						.select(this._in.selector).boundingClientRect()
+				} else {
+					// 获取 scroll-view 的位置和滚动距离
+					selector.selectViewport().scrollOffset() // 获取窗口的滚动距离
+				}
+				selector.exec(res => {
+					if (!res[0]) {
+						reject(Error('Label not found'))
+						return
+					}
+					const scrollTop = res[1].scrollTop + res[0].top - (res[2] ? res[2].top : 0) + offset
+					if (this._in) {
+						// scroll-view 跳转
+						this._in.page[this._in.scrollTop] = scrollTop
+					} else {
+						// 页面跳转
+						uni.pageScrollTo({
+							scrollTop,
+							duration: 300
+						})
+					}
+					resolve()
+				})
+				// #endif
+			})
+		},
+
+		/**
+		 * @description 获取文本内容
+		 * @return {String}
+		 */
+		getText(nodes) {
+			let text = '';
+			(function traversal(nodes) {
+				for (let i = 0; i < nodes.length; i++) {
+					const node = nodes[i]
+					if (node.type === 'text') {
+						text += node.text.replace(/&amp;/g, '&')
+					} else if (node.name === 'br') {
+						text += '\n'
+					} else {
+						// 块级标签前后加换行
+						const isBlock = node.name === 'p' || node.name === 'div' || node.name === 'tr' || node.name === 'li' || (node.name[0] === 'h' && node.name[1] > '0' && node.name[1] < '7')
+						if (isBlock && text && text[text.length - 1] !== '\n') {
+							text += '\n'
+						}
+						// 递归获取子节点的文本
+						if (node.children) {
+							traversal(node.children)
+						}
+						if (isBlock && text[text.length - 1] !== '\n') {
+							text += '\n'
+						} else if (node.name === 'td' || node.name === 'th') {
+							text += '\t'
+						}
+					}
+				}
+			})(nodes || this.nodes)
+			return text
+		},
+
+		/**
+		 * @description 获取内容大小和位置
+		 * @return {Promise}
+		 */
+		getRect() {
+			return new Promise((resolve, reject) => {
+				uni.createSelectorQuery()
+					// #ifndef MP-ALIPAY
+					.in(this)
+					// #endif
+					.select('#_root').boundingClientRect().exec(res => res[0] ? resolve(res[0]) : reject(Error('Root label not found')))
+			})
+		},
+
+		/**
+		 * @description 暂停播放媒体
+		 */
+		pauseMedia() {
+			for (let i = (this._videos || []).length; i--;) {
+				this._videos[i].pause()
+			}
+			// #ifdef APP-PLUS
+			const command = 'for(var e=document.getElementsByTagName("video"),i=e.length;i--;)e[i].pause()'
+			// #ifndef APP-PLUS-NVUE
+			let page = this.$parent
+			while (!page.$scope) page = page.$parent
+			page.$scope.$getAppWebview().evalJS(command)
+			// #endif
+			// #ifdef APP-PLUS-NVUE
+			this.$refs.web.evalJs(command)
+			// #endif
+			// #endif
+		},
+
+		/**
+		 * @description 设置媒体播放速率
+		 * @param {Number} rate 播放速率
+		 */
+		setPlaybackRate(rate) {
+			this.playbackRate = rate
+			for (let i = (this._videos || []).length; i--;) {
+				this._videos[i].playbackRate(rate)
+			}
+			// #ifdef APP-PLUS
+			const command = 'for(var e=document.getElementsByTagName("video"),i=e.length;i--;)e[i].playbackRate=' + rate
+			// #ifndef APP-PLUS-NVUE
+			let page = this.$parent
+			while (!page.$scope) page = page.$parent
+			page.$scope.$getAppWebview().evalJS(command)
+			// #endif
+			// #ifdef APP-PLUS-NVUE
+			this.$refs.web.evalJs(command)
+			// #endif
+			// #endif
+		},
+
+		setPlugins(plugin) {
+			for (let i = plugin.length; i--;) {
+				this.plugins.push(new plugin[i](this))
+			}
+		},
+		/**
+		 * @description 设置内容
+		 * @param {String} content html 内容
+		 * @param {Boolean} append 是否在尾部追加
+		 */
+		setContent(content, append) {
+			if (!append || !this.imgList) {
+				this.imgList = []
+			}
+			const nodes = new Parser(this).parse(content)
+			// #ifdef APP-PLUS-NVUE
+			if (this._ready) {
+				this._set(nodes, append)
+			}
+			// #endif
+			this.$set(this, 'nodes', append ? (this.nodes || []).concat(nodes) : nodes)
+
+			// #ifndef APP-PLUS-NVUE
+			this._videos = []
+			this.$nextTick(() => {
+				this._hook('onLoad')
+				this.$emit('load')
+			})
+
+			if (this.lazyLoad || this.imgList._unloadimgs < this.imgList.length / 2) {
+				// 设置懒加载，每 350ms 获取高度，不变则认为加载完毕
+				let height = 0
+				const callback = rect => {
+					if (!rect || !rect.height) rect = {}
+					// 350ms 总高度无变化就触发 ready 事件
+					if (rect.height === height) {
+						this.$emit('ready', rect)
+					} else {
+						height = rect.height
+						setTimeout(() => {
+							this.getRect().then(callback).catch(callback)
+						}, 350)
+					}
+				}
+				this.getRect().then(callback).catch(callback)
+			} else {
+				// 未设置懒加载，等待所有图片加载完毕
+				if (!this.imgList._unloadimgs) {
+					this.getRect().then(rect => {
+						this.$emit('ready', rect)
+					}).catch(() => {
+						this.$emit('ready', {})
+					})
+				}
+			}
+			// #endif
+		},
+
+		/**
+		 * @description 调用插件钩子函数
+		 */
+		_hook(name) {
+			for (let i = this.plugins.length; i--;) {
+				if (this.plugins[i][name]) {
+					this.plugins[i][name]()
+				}
+			}
+		},
+
+		// #ifdef APP-PLUS-NVUE
+		/**
+		 * @description 设置内容
+		 */
+		_set(nodes, append) {
+			this.$refs.web.evalJs('setContent(' + JSON.stringify(nodes).replace(/%22/g, '') + ',' + JSON.stringify([this.containerStyle.replace(/(?:margin|padding)[^;]+/g, ''), this.errorImg, this.loadingImg, this.pauseVideo, this.scrollTable, this.selectable]) + ',' + append + ')')
+		},
+
+		/**
+		 * @description 接收到 web-view 消息
+		 */
+		_onMessage(e) {
+			const message = e.detail.data[0]
+			switch (message.action) {
+				// web-view 初始化完毕
+				case 'onJSBridgeReady':
+					this._ready = true
+					if (this.nodes) {
+						this._set(this.nodes)
+					}
+					break
+				// 内容 dom 加载完毕
+				case 'onLoad':
+					this.height = message.height
+					this._hook('onLoad')
+					this.$emit('load')
+					break
+				// 所有图片加载完毕
+				case 'onReady':
+					this.getRect().then(res => {
+						this.$emit('ready', res)
+					}).catch(() => {
+						this.$emit('ready', {})
+					})
+					break
+				// 总高度发生变化
+				case 'onHeightChange':
+					this.height = message.height
+					break
+				// 图片点击
+				case 'onImgTap':
+					this.$emit('imgtap', message.attrs)
+					if (this.previewImg) {
+						uni.previewImage({
+							current: parseInt(message.attrs.i),
+							urls: this.imgList
+						})
+					}
+					break
+				// 链接点击
+				case 'onLinkTap': {
+					const href = message.attrs.href
+					this.$emit('linktap', message.attrs)
+					if (href) {
+						// 锚点跳转
+						if (href[0] === '#') {
+							if (this.useAnchor) {
+								dom.scrollToElement(this.$refs.web, {
+									offset: message.offset
+								})
+							}
+						} else if (href.includes('://')) {
+							// 打开外链
+							if (this.copyLink) {
+								// #ifdef APP-PLUS
+                                plus.runtime.openWeb(href)
+                                // #endif
+                                // #ifdef APP-HARMONY
+                                plus.runtime.openURL(href)
+                                // #endif
+							}
+						} else {
+							uni.navigateTo({
+								url: href,
+								fail() {
+									uni.switchTab({
+										url: href
+									})
+								}
+							})
+						}
+					}
+					break
+				}
+				case 'onPlay':
+					this.$emit('play')
+					break
+				// 获取到锚点的偏移量
+				case 'getOffset':
+					if (typeof message.offset === 'number') {
+						dom.scrollToElement(this.$refs.web, {
+							offset: message.offset + this._navigateTo.offset
+						})
+						this._navigateTo.resolve()
+					} else {
+						this._navigateTo.reject(Error('Label not found'))
+					}
+					break
+				// 点击
+				case 'onClick':
+					this.$emit('tap')
+					this.$emit('click')
+					break
+				// 出错
+				case 'onError':
+					this.$emit('error', {
+						source: message.source,
+						attrs: message.attrs
+					})
+			}
+		}
+		// #endif
+	}
+}
+</script>
+
+<style>
+/* #ifndef APP-PLUS-NVUE */
+/* 根节点样式 */
+._root {
+	padding: 1px 0;
+	overflow-x: auto;
+	overflow-y: hidden;
+	-webkit-overflow-scrolling: touch;
+}
+
+/* 长按复制 */
+._select {
+	user-select: text;
+}
+
+/* #endif */
+</style>