suchen

Heim  >  Fragen und Antworten  >  Hauptteil

javascript – Wie überwacht die El-Eingabe von Element UI die Eingabetaste?

Es scheint kein Enter-Ereignis unter den offiziell aufgedeckten Ereignissen zu geben, und wenn ich @keyup.enter direkt auf el-input schrieb, konnte ich das Ereignis nicht erfassen. Ich hoffe, Gott kann mich aufklären

阿神阿神2825 Tage vor851

Antworte allen(5)Ich werde antworten

  • 漂亮男人

    漂亮男人2017-05-19 10:48:36

    @keyup.enter.native

    Antwort
    0
  • 怪我咯

    怪我咯2017-05-19 10:48:36

    <el-input type="password" v-model="loginForm.password" placeholder="密码" @keyup.enter.native="loginSubmit"></el-input>

    @keyup.enter.native就可以触发了

    Antwort
    0
  • 仅有的幸福

    仅有的幸福2017-05-19 10:48:36

    element-ui api中表示 并没有onkeyup这个事件 所以 建议还是换input 如果非得用这个事件的话

    Antwort
    0
  • PHPz

    PHPz2017-05-19 10:48:36

    同意@CoquettishPoppy的观点,建议撸个原生input吧,样式写个相似的。

    Antwort
    0
  • 为情所困

    为情所困2017-05-19 10:48:36

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="UTF-8">
        <link href="http://cdn.bootcss.com/element-ui/1.2.7/theme-default/index.css" rel="stylesheet" />
    </head>
    <body>
        <p id="app">
            <el-input v-model="input" v-enter @enter.native="log" placeholder="请输入内容"></el-input>
        </p>
    
        <script src="http://cdn.bootcss.com/vue/2.1.0/vue.min.js"></script>
        <script src="http://cdn.bootcss.com/element-ui/1.2.7/index.js"></script>
    
        <script>
            Vue.directive('enter', {
                bind: function (el, binding, vnode) {
                    const input = el.getElementsByTagName('input')[0];
    
                    input.addEventListener('keypress', function (e) {
                        var key = e.which || e.keyCode;
    
                        if (key === 13) { // 13 is enter
                            // code for enter
                            el.dispatchEvent(new Event('enter'))
                        }
                    })
                },
                unbind: function (el, binding, vnode) {
    
                }
            })
    
            new Vue({
                el: '#app',
                data() {
                    return {
                        input: null
                    }
                },
                methods: {
                    log() {
                        console.log(this.input)
                    }
                }
            })
        </script>
    </body>
    </html>

    Antwort
    0
  • StornierenAntwort