<template>
<view class="content">
<!-- <image class="logo" src="/static/logo.png"></image> -->
<view class="text-area">
<!-- <text class="title">{{title}}</text> -->
<!-- 这里用focus也不行 -->
<editor id="editor" @ready="onEditorReady" @tap="onEditorFocus" placeholder="再次输入"></editor>
</view>
</view>
</template>
<script>
export default {
data() {
return {
// title: 'Hello',
editorCtx: null
}
},
onLoad() {
},
methods: {
onEditorReady(){
let that = this
this.$nextTick(()=>{
uni.createSelectorQuery().in(this).select('#editor').context((res) => {
console.log(res.context);
that.editorCtx = res.context
}).exec()
setTimeout(()=>{
this.editorCtx.setContents({
html: ""
})
},1000)
})
},
onEditorFocus(){
this.onselectText()
},
onselectText(){
let that = this
this.editorCtx.getSelectionText({
success(res){
console.log(res,"选中的内容");
that.selectText = res.text
},
fail(fail){
console.log(fail)
}
})
},
}
}
</script>
![4***@qq.com](https://img-cdn-tc.dcloud.net.cn/account/identicon/26415bd39d2de6ca8bd6f9f7440e845d.png)
- 发布:2024-02-28 00:44
- 更新:2024-02-28 16:18
- 阅读:126
产品分类: uniapp/小程序/微信
PC开发环境操作系统: Windows
PC开发环境操作系统版本号: 10.0.22631.1830
HBuilderX类型: 正式
HBuilderX版本号: 3.96
第三方开发者工具版本号: 1.06.2401020
基础库版本号: 3.2.4
项目创建方式: HBuilderX
示例代码:
操作步骤:
<template>
<view class="content">
<!-- <image class="logo" src="/static/logo.png"></image> -->
<view class="text-area">
<!-- <text class="title">{{title}}</text> -->
<!-- 这里用focus也不行 -->
<editor id="editor" @ready="onEditorReady" @tap="onEditorFocus" placeholder="再次输入"></editor>
</view>
</view>
</template>
<script>
export default {
data() {
return {
// title: 'Hello',
editorCtx: null
}
},
onLoad() {
},
methods: {
onEditorReady(){
let that = this
this.$nextTick(()=>{
uni.createSelectorQuery().in(this).select('#editor').context((res) => {
console.log(res.context);
that.editorCtx = res.context
}).exec()
setTimeout(()=>{
this.editorCtx.setContents({
html: ""
})
},1000)
})
},
onEditorFocus(){
this.onselectText()
},
onselectText(){
let that = this
this.editorCtx.getSelectionText({
success(res){
console.log(res,"选中的内容");
that.selectText = res.text
},
fail(fail){
console.log(fail)
}
})
},
}
}
</script>
<template>
<view class="content">
<!-- <image class="logo" src="/static/logo.png"></image> -->
<view class="text-area">
<!-- <text class="title">{{title}}</text> -->
<!-- 这里用focus也不行 -->
<editor id="editor" @ready="onEditorReady" @tap="onEditorFocus" placeholder="再次输入"></editor>
</view>
</view>
</template>
<script>
export default {
data() {
return {
// title: 'Hello',
editorCtx: null
}
},
onLoad() {
},
methods: {
onEditorReady(){
let that = this
this.$nextTick(()=>{
uni.createSelectorQuery().in(this).select('#editor').context((res) => {
console.log(res.context);
that.editorCtx = res.context
}).exec()
setTimeout(()=>{
this.editorCtx.setContents({
html: ""
})
},1000)
})
},
onEditorFocus(){
this.onselectText()
},
onselectText(){
let that = this
this.editorCtx.getSelectionText({
success(res){
console.log(res,"选中的内容");
that.selectText = res.text
},
fail(fail){
console.log(fail)
}
})
},
}
}
</script>
预期结果:
{
"errMsg": "ok",
"text":"选择"
}
{
"errMsg": "ok",
"text":"选择"
}
实际结果:
{
"errMsg": "ok",
"text":""
}
{
"errMsg": "ok",
"text":""
}
bug描述:
<template>
<view class="content">
<!-- <image class="logo" src="/static/logo.png"></image> -->
<view class="text-area">
<!-- <text class="title">{{title}}</text> -->
<!-- 这里用focus也不行 -->
<editor id="editor" @ready="onEditorReady" @tap="onEditorFocus" placeholder="再次输入"></editor>
</view>
</view>
</template>
<script>
export default {
data() {
return {
// title: 'Hello',
editorCtx: null
}
},
onLoad() {
},
methods: {
onEditorReady(){
let that = this
this.$nextTick(()=>{
uni.createSelectorQuery().in(this).select('#editor').context((res) => {
console.log(res.context);
that.editorCtx = res.context
}).exec()
setTimeout(()=>{
this.editorCtx.setContents({
html: ""
})
},1000)
})
},
onEditorFocus(){
this.onselectText()
},
onselectText(){
let that = this
this.editorCtx.getSelectionText({
success(res){
console.log(res,"选中的内容");
that.selectText = res.text
},
fail(fail){
console.log(fail)
}
})
},
}
}
</script>
使用最小实例代码选择内容时 微信开发者工具正常 手机真机无法获取选中内容 使用 editor 组件的 getSelectionText
4***@qq.com (作者)
正常了,他这里editor组件必须要外部按钮才能获取到内容
2024-03-08 18:29