Skip to content

Commit d29197e

Browse files
authored
feat: make the content editor focused when the reply form is opened (#104)
支持打开评论回复时,自动聚焦输入框。 /kind feature ```release-note 支持打开评论回复时,自动聚焦输入框。 ```
1 parent db8b800 commit d29197e

2 files changed

Lines changed: 13 additions & 0 deletions

File tree

packages/comment-widget/src/base-form.ts

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -223,6 +223,10 @@ export class BaseForm extends LitElement {
223223
form?.reset();
224224
}
225225

226+
setFocus() {
227+
this.textareaRef.value?.focus();
228+
}
229+
226230
static override styles = [
227231
varStyles,
228232
baseStyles,

packages/comment-widget/src/reply-form.ts

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,15 @@ export class ReplyForm extends LitElement {
3838

3939
baseFormRef: Ref<BaseForm> = createRef<BaseForm>();
4040

41+
override connectedCallback(): void {
42+
super.connectedCallback();
43+
44+
setTimeout(() => {
45+
this.scrollIntoView({ block: 'center', inline: 'start', behavior: 'smooth' });
46+
this.baseFormRef.value?.setFocus();
47+
}, 0);
48+
}
49+
4150
override render() {
4251
return html`<base-form ${ref(this.baseFormRef)} @submit="${this.onSubmit}"></base-form>`;
4352
}

0 commit comments

Comments
 (0)