markdown<template>
<div class="pageWrapper">
<div style="flex: 1;" @click="hiden">
</div>
<div class="commitInput">
<input :focus="focus" v-model="sendText" :cursor-spacing="10"
class="textarea" placeholder="对作品说点什么吧..." :show-confirm-bar="false" />
<div class="operItem" style="padding-left: 15rpx;">
{{focus}}
<text class="iconfont"></text>
</div>
<div class="operItem" style="padding-left: 5rpx;">
<!-- <div class="sendBtn">
<text class="text">发送</text>
</div> -->
<text class="iconfont" style="transform: rotate(270deg);color: #5d5d5d;"></text>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
focus: false,
sendText: ''
}
},
mounted() {
var that = this;
uni.$on("scrollerVideoCommitInputShow", function() {
that.getFocus();
})
},
methods: {
getFocus() {
this.focus = false;
this.$nextTick(function() {
this.focus = true;
})
},
hiden() {
console.log("点击了");
var that = this;
that.focus = false;
that.commitInput = uni.getSubNVueById('scrollerVideoCommitInput');
that.commitInput.hide('slide-in-bottom', 100);
},
}
}
</script>
<style scoped>
.commitInput {
background-color: white;
padding: 20rpx;
flex-direction: row;
align-items: flex-end;
}
.commitInput .textarea {
font-size: 28rpx;
background-color: #eee;
height: 90rpx;
padding: 15rpx 20rpx;
border-radius: 10rpx;
flex: 1;
}
.operItem {}
.operItem .iconfont {
font-size: 65rpx;
color: #333;
}
.sendBtn {
background-color: red;
padding: 10rpx 20rpx;
border-radius: 8rpx;
}
.sendBtn .text {
font-size: 25rpx;
color: #fff;
} </style> markdown
1***@qq.com (作者)
没用 uni.$on("scrollerVideoCommitInputShow", function() { that.getFocus(); }) }, 我这里已经写了
2022-12-07 16:43
DCloud_UNI_Anne
回复 1***@qq.com: 放onShow里试试呢
2022-12-07 16:45
1***@qq.com (作者)
回复 DCloud_UNI_Anne: 这个问题解决了 文档里说 nvue下 不能用focus控制焦点 要用组件的focus() 和 blur()方法去控制 但是出现了新的问题 （软键盘正常弹出 页面正常上推 但textarea并没有获取到焦点）
2022-12-22 21:21