<template>
	<web-view :src="'/uni_modules/yingbing-ReadPage/hybrid/html/content.html?content=' + encodeURIComponent(contentSync)"></web-view>
</template>

<script>
	export default {
		inject: ['color', 'fontSize', 'fontFamily', 'lineHeight', 'selectable'],
		props: {
			item: {
				type: Object,
				default () {
					return new Object
				}
			}
		},
		computed: {
			contentSync () {
				let content = this.item.content || ''
				content = content.replace('<whole-render', '<div').replace('<\/whole-render>', '<\/div>')
				return `<div class="yingbing-reader-content-html ${this.selectable ? 'user-selectable' : 'user-selectclose'}" style="box-sizing: border-box;color:${this.color};font-family:${this.fontFamily};font-size:${this.fontSize}px;line-height:${this.lineHeight}px;">` + content + '</div>'
			}
		}
	}
</script>

<style>
</style>