Enter 키를 누르면 vuejs의 버튼을 클릭합니다.

Enter 키를 누르면 vuejs의 버튼을 클릭합니다.

내 바이올린: DEMO

"fb-send"라는 버튼이 있는데, 입력 필드에서 "Enter" 키를 누르면 이 버튼을 클릭해야 합니다.어떻게 하면 좋을까요?

<input @keyup.enter="" placeholder="Reply here" class="fb-comment-input" />
<i class="material-icons fb-button-right fb-send">&#x21E8;</i>

어떤 도움이라도 주시면 감사하겠습니다.감사합니다.

입력 필드에서 직접 fb_send 메서드를 호출할 수도 있습니다.

@keyup.enter="enterClicked()"

<Input v-model="value1" size="large" placeholder="large size" @keyup.enter.native="search"></Input>

여기 내 응답 바이올린: ANSWER-DEMO

$refs를 사용하여 해결했습니다.

new Vue({
    el:'#app',
  methods:{
    enterClicked(){
        alert("Enter clicked")
    },
    trigger () {
        this.$refs.sendReply.click()
    }
  }
})

2020년 6월 14일

Enter 와 KeyPress 는 모두 동작합니다.

다음과 같은 형식으로 입력 필드를 가져옵니다.

<form v-on:keyup.enter="login">
    <input type="email" v-model="email">
    <input type="password" v-model="password">
    <button type="button" @click="login">Login</button>
</form>

Javascript 부품:

<script>
export default {
    data() {
        return {
            email: null,
            password: null
        }
    },
    methods: {
        login() {
           console.log("Login is working........");
       }
    }
}
</script>

전화하셔야 합니다.enterClick다음과 같은 입력 필드 내 메서드:

<div id="app">
    <input @keyup.enter="enterClicked" placeholder="Reply here" class="fb-comment-input" />
    <i class="fb-send" @click="enterClicked">&#x21E8;</i>
</div>

---

<script>
    new Vue({
        el:'#app',
        methods:{
          enterClicked(){
             alert("Enter clicked")
          }
        }
    });
</script>

use@keyup.enter.native=function으로 연락주세요.

네이티브 함수는 브라우저/서버/자바스크립트에서 제공하는 함수입니다.

        $("form").keypress(function (e) {
            debugger;
            if(e.charCode == 13){
                e.stopImmediatePropagation();
                e.preventDefault();
            }
        });

언급URL : https://stackoverflow.com/questions/46639549/on-key-press-of-enter-click-a-button-in-vuejs