uni-app editor富文本编辑器

小灰灰 2022-10-01 13:47 519阅读 0赞

<form @submit="formCompany" @reset="formReset">
    <view class="uni-form-item uni-column">
    	<view class="title">公司介绍：</view>
    	<editor style="background-color: #EBEBEB; width: 100%; padding: 10upx;" placeholder="公司介绍" id="editor" class="ql-container" :placeholder="placeholder" @input="editorChange" @ready="onEditorReady"></editor>
    </view>
    					
    <view class="uni-btn-v">
    	<input hidden='true'  v-model="gongsijieshao" name='gongsijieshao' />
    	<button formType="submit">保存</button>
    </view>
    </form>

export default {
    		data() {
    			return {
    				gongsijieshao:''
    			}
    		},
    		components: {
    			// crop
    		},
    		onLoad(e) {
    		this.chushihua()
    		},
    		methods: {
    			
    			chushihua:function(){
    				this.$api.request("/wapbusiness/userinfo").then((res)=>{
    					this.gongsijieshao = res.data.company.gongsijieshao
    				}).catch((e)=>{
    					
    				})
    			},
    			 onEditorReady() {
    				 const that = this
                    uni.createSelectorQuery().select('#editor').context((res) => {
    					
                        this.editorCtx = res.context
    					this.editorCtx.setContents({
    						html:that.info.gongsijieshao,
    						success:(res)=> {
    							console.log(res)
    						},
    						fail:(res)=> {
    							console.log(res)
    							},
    							})
                    }).exec()
                },
    			editorChange: function(e){
    				this.gongsijieshao = e.detail.html
    			}
    		}
    	}

发表评论取消回复

表情：

评论列表（有 0 条评论，519人围观）

还没有评论，来说两句吧...

相关阅读

相关 uniapp 正常显示editor富文本编辑器的内容

如果不添加editor的样式文件，空格、图片都会显示不正常，需要按照官方文档提示，第一添加样式，第二，设置对应的显示方式。

╰+哭是因爲堅強的太久メ/ 2024年04月22日 15:11/ 0 赞/ 40 阅读

相关富文本编辑器 VUE-QUILL-EDITOR 使用教程

一.基础用法 1、NPM 导入 VUE-QUILL-EDITOR npm install vue-quill-editor --save 2、引入 VU

以你之姓@/ 2024年03月22日 16:25/ 0 赞/ 42 阅读

相关 SpringBoot整合Editor.Md实现Markdown富文本编辑器

SpringBoot整合Editor.Md实现Markdown富文本编辑器前言：最近需要做一个后台管理，且需要有一个公告功能，可以实现图片上传等功能。于是，就想到了整合

Myth丶恋晨/ 2022年12月06日 01:22/ 0 赞/ 186 阅读

相关 uni-app的editor的富文本编辑器

在官方文档中教程真是也太简单了，大家可以在官方代码中找到完整的内容 https://github.com/dcloudio/hello-uniapp/blob/mas

秒速五厘米/ 2022年10月27日 13:48/ 0 赞/ 951 阅读

相关 uni-app editor富文本编辑器

<form @submit="formCompany" @reset="formReset"> <view class="uni-form-item uni-c

小灰灰/ 2022年10月01日 13:47/ 0 赞/ 520 阅读

相关 vue-quill-editor富文本编辑器（基于Vue脚手架）

（1）安装vue-quill-editor cnpm install vue-quill-editor --save 或 npm install vu

Dear 丶/ 2022年03月21日 04:24/ 0 赞/ 263 阅读

相关基于Vue的Vue-Quill-Editor富文本编辑器

先看效果图：女神镇楼下载Vue-Quill-Editor npm install vue-quill

亦凉/ 2022年03月15日 10:14/ 0 赞/ 217 阅读

相关 vue中使用vue-quill-editor富文本编辑器

最近项目中接触到了富文本编辑器，最终选择了vue-quill-editor。第一步：首先下载安装 npm install vue-quill-editor --

迈不过友情╰/ 2022年02月03日 01:37/ 0 赞/ 267 阅读

相关 Editor富文本编辑器（图片上传）

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3podXBl

小咪咪/ 2022年01月12日 15:33/ 0 赞/ 404 阅读

相关微信小程序富文本编辑器 editor

[完整微信小程序(Java后端) 技术贴目录清单页面（必看）][Java_] 富文本编辑器，可以对图片、文字进行编辑。编辑器导出内容支持带标签的 `html`和纯

逃离我推掉我的手/ 2021年09月08日 00:28/ 0 赞/ 996 阅读