fix: 修复取消活动管理弹窗输入框聚焦问题

This commit is contained in:
2026-03-06 10:30:37 +08:00
parent 1aa12a86c2
commit 05b89a4aeb

View File

@@ -16,8 +16,8 @@ const CancelPopup = forwardRef((props, ref) => {
const { detail } = props;
const [visible, setVisible] = useState(false);
const [cancelReason, setCancelReason] = useState("");
const [inputFocus, setInputFocus] = useState(false);
const onFinish = useRef(null);
const inputRef = useRef(null);
const { current_players, participants = [], publisher_id } = detail;
const realParticipants = participants
@@ -32,16 +32,15 @@ const CancelPopup = forwardRef((props, ref) => {
show: (onAct) => {
onFinish.current = onAct;
setVisible(true);
// 使用 requestAnimationFrame 替代 setTimeout(0),性能更好
requestAnimationFrame(() => {
requestAnimationFrame(() => {
inputRef.current && inputRef.current.focus();
});
// 使用 Taro.nextTick 确保在下一个渲染周期后聚焦
Taro.nextTick(() => {
setInputFocus(true);
});
},
}));
function onClose() {
setInputFocus(false);
setVisible(false);
setCancelReason("");
}
@@ -85,13 +84,13 @@ const CancelPopup = forwardRef((props, ref) => {
{hasOtherJoin && (
<View className={styles.cancelReason}>
<Input
ref={inputRef}
className={styles.input}
placeholder="请输入取消理由"
focus
focus={inputFocus}
value={cancelReason}
onInput={(e) => setCancelReason(e.detail.value)}
maxlength={100}
onBlur={() => setInputFocus(false)}
/>
</View>
)}