Vue.js의 메서드 내에서 입력 포커스 이벤트를 트리거하려면 어떻게 해야 합니까?
다음 이벤트를 사용하고 있는 입력이 있습니다.
<b-nput
class="input"
id="link"
v-model="link"
placeholder="link"
@focus="$event.target.select()"
></b-input>
이거 어떻게 쓰죠?@focus="$event.target.select()"이벤트 내부:
위의 방법은 값을 복사합니다.사용자가 copy를 클릭했을 때 위의 select focus 이벤트를 트리거해야 합니다.올바르게 달성하려면 어떻게 해야 합니까?
더하다saved포커스 이벤트 핸들러로서의 메서드:
@focus="saved"
방법:
methods: {
saved(event){ //the event is passed automatically as parameter
event.target.select()
}
}
편집:
추가 시도ref입력 요소
<b-input
ref="input"
class="input"
id="link"
v-model="link"
placeholder="link"
@focus="$event.target.select()"
></b-input>
그런 다음 메서드 내에서 프로그래밍 방식으로 포커스를 트리거합니다.
methods: {
async copy(s) {
await navigator.clipboard.writeText(s)
this.$refs.input.focus();
...
}
}
당신은 그것을 가질 수 있습니다.$event에 대한 참조saved방법
<b-nput
class="input"
id="link"
v-model="link"
placeholder="link"
@focus="saved"
></b-input>
methods: {
saved(event){
console.log(event)
}
}
ref - https://vuejs.org/v2/guide/events.html
A를 주다ref입력에 따라주세요.
<b-input
class="input"
id="link"
v-model="link"
placeholder="link"
ref="theInput"
></b-input>
컴포넌트 스크립트의 임의의 장소:
this.$refs['theInput'].focus();
언급URL : https://stackoverflow.com/questions/63448100/how-to-trigger-the-input-focus-event-inside-a-method-in-vue-js
'programing' 카테고리의 다른 글
| 다차원 배열에서 단일 열 반환 (0) | 2022.11.02 |
|---|---|
| PHP를 사용하여 어레이가 비어 있는지 확인하는 방법 (0) | 2022.11.02 |
| 속성별로 개체 목록 그룹화 (0) | 2022.11.02 |
| 30분 후에 PHP 세션을 만료하려면 어떻게 해야 합니까? (0) | 2022.11.02 |
| Composer에게 다른 PHP 버전을 사용하도록 지시합니다. (0) | 2022.11.02 |