Vue Login 页面优化

1.Vue回车事件,提交表单

<el-form id="form" @keyup.enter.native="onSubmit">

@keyup.enter: 正常的html标签可以使用
@keyup.enter.native: 封装的标签,比如 ElementUI 封装的标签

2.页面加载后,input 获得焦点(光标)

在js中:

methods:{

},
directives: {
        //自定义 v-focus 指令
        focus: {
        	// el: 绑定自定义指令的 dom 元素
            inserted: function (el) {
            //选择input标签,添加 获得焦点事件
            el.querySelector('input').focus()
            }
        }
    },

在标签中添加 v-focus

<el-input v-model="form.username" v-focus></el-input>

你可能感兴趣的:(Vue)