mp-html 富文本

复制于 mp-html

代码演示

<script setup>
const html = `
  <h1>这是标题1</h1>
  <h2>这是标题2</h2>
  <h3>这是标题3</h3>
  <p>这是段落1</p>
  <p>这是段落2</p>
`

const tagStyle = {
  p: 'font-weight: 400; font-size: 13px; color: rgba(0,0,0,.6);',
  h1: 'font-weight: 600; font-size: 15px; color: red;',
  h2: 'font-weight: 600; font-size: 14px; color: green;',
  h3: 'font-weight: 600; font-size: 13px; color: rgba(0,0,0,1);',
}
</script>

<template>
  <mp-nav-bar title="mp-html" />

  <view class="content">
    <mp-html :content="html" :tag-style="tagStyle" />
  </view>
</template>

<style scoped>
.content {
  padding: 15rpx;
}
</style>

API

Props

Prop name	Description	Type	Values	Default
containerStyle		string	-	''
content		string	-	''
copyLink		boolean|string	-	true
domain		string	-
errorImg		string	-	''
lazyLoad		boolean|string	-	false
loadingImg		string	-	''
pauseVideo		boolean|string	-	true
previewImg		boolean|string	-	true
scrollTable		boolean|string	-
selectable		boolean|string	-
setTitle		boolean|string	-	true
showImgMenu		boolean|string	-	true
tagStyle		object	-
useAnchor		boolean|number	-

Events

Event name	Properties	Description
load
ready
imgtap
linktap
play
error
tap
click

Slots

Name	Description	Bindings
default

源码

组件 • 示例