bctos-rich-editor: введение

bctos-rich-editor — это разработка на основе последней версии tinymce 5.10, которая в основном расширяет возможности загрузки изображений и видео в облачное хранилище uniCloud.

Особенно в части загрузки видео, официальные и онлайн-решения используют виртуальный элемент input и форму для загрузки, что не подходит для требований к загрузке в облачные хранилища.

После длительного исследования было обнаружено, что uniCloud предоставляет интерфейс chooseAndUploadFile, который может просто и идеально решить проблему загрузки файлов в tinymce (не ограничиваясь видео).

Описание компонентов форматированного текста для фронтенда

Рекомендуется использовать другой плагин bctos-rich-text для редактирования содержимого этого редактора, чтобы решить проблемы с воспроизведением видео и отображением изображений, ширина которых превышает размер экрана мобильного устройства.

Он позволяет идеально реализовать демонстрацию видео и графики в смешанном порядке в мини-приложениях.

Способ установки

Этот компонент соответствует стандарту easycom. Начиная с HBuilderX 2.5.5, его можно импортировать в проект, и он будет готов к использованию непосредственно на странице template без необходимости импорта и регистрации компонентов на странице.

Основные способы использования

После настройки свойства v-model компонент автоматически инициализирует содержимое и отображает интерфейс редактора.

<template>
      <uni-forms-item name="content" label="产品介绍">
        <bctos-rich-editor v-model="content" />
      </uni-forms-item>
</template>

export default {
	data() { 
		return {
			content: `<p>这里是内容段落一，下面放置了第一个视频</p><br>
			<p><video controls="controls">
			<source src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-042c6b2e-63dd-4fe1-b729-b6327b68450a/d906ba15-9041-4137-bc3f-44a413c855e0.mp4" type="video/mp4" /></video></p><br>
			<p>这里是内容段落二，下面放置了第二个视频</p><br>
			<p><video controls="controls">
			<source src="https://vkceyugu.cdn.bspapp.com/VKCEYUGU-042c6b2e-63dd-4fe1-b729-b6327b68450a/ae4a89d7-5c7e-48d2-b6f9-0da5c848bbda.mp4" type="video/mp4" /></video></p><br>
			<p>后面其它更多内容...</p>`,
		}
	}
}

API

bctos-rich-text Props

Справочные материалы

tinymce китайский документ tian-article-admin плагин

Дополнительная помощь

Если вы хотите расширить другие функции, пожалуйста, свяжитесь с нами для индивидуальной разработки: QQ: 203163051