<template>

<view style="padding-top: 200rpx;">

<editor

id="editor"

class="ql-container"

:placeholder="placeholder"

@statuschange="onStatusChange"

@ready="onEditorReady"

>

<text v-for="(item,index) in customBlockList" :key="item.blockId">

<editor-portal :key="item.blockId">

<text class="flex">@好友</text>

</editor-portal>

</text>

</editor>

<button @click="insertCustomBlock">插入话题</button>

</view>

</template>

<script setup>

import { ref, onMounted } from 'vue'

const placeholder = ref('开始输入...');

const editorCtx = ref(null);

const customBlockList = ref([]);

const onEditorReady = () => {

wx.createSelectorQuery().select('#editor').context(function (res) {

editorCtx.value = res.context

}).exec()

}

const onStatusChange = () => {

const formats = e.detail;

console.log(formats);

}

// 插入

const insertCustomBlock = () => {

editorCtx.value.insertCustomBlock({

nowrap:true,

success(res) {

customBlockList.value.push({blockId: res.blockId})

console.log(customBlockList.value);

}

})

}

</script>

这个也是设置为nowrap:true,的，为啥不能和文本齐平呢？这个是官方的bug吧