uniapp的editor標籤的使用

<editor id="editor" class="ql-container text-cyan radius"  @ready="onEditorReady" @input='contentChange' :read-only='false'></editor>	
<script>
    methods:{
			onEditorReady() {
			    uni.createSelectorQuery().select('#editor').context((res) => {
					console.log(res)
			        this.editorCtx =res.context;
					let content={
						html:`<p wx:nodeid="70">import AceRow from "@/xx/Ace_Row"</p><p wx:nodeid="73">components:{</p><p wx:nodeid="79" style='white-space:pre;'>	AceRow</p><p wx:nodeid="76">}</p><p wx:nodeid="76"><br></p><p wx:nodeid="13">&lt;Ace-Row :gutter='10'&gt;</p><p wx:nodeid="66" style='white-space:pre;'>	&lt;Ace-Col :span='5' :offset='1' &gt;&lt;/Ace-Col&gt;						</p><p wx:nodeid="68">&lt;/Ace-Row&gt;</p>`
					}
					this.editorCtx.setContents(content);//設置富文本編輯器的內容
			    }).exec()
			},
			contentChange(e){
				console.log(e.detail)
			}
		}
</script>

參考:https://www.jianshu.com/p/abdb2fcc49c4

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章