Element: [Feature Request] API for focusing input elements

[dsl101]

Existing Component

Yes

Component Name

el-input

Description

I'm just starting with Element-UI, and need to programmatically set the focus to a form input field. In another UI framework I've used, it was possible to set the Vue ref of the input element in the template and then use this code:

  this.$refs.password.focus().select()

to set the focus and select the existing text. This is useful for keyboard accelerators - pressing 'enter' on a username field should focus and select the password box.

Does Element-UI have an equivalent API for input elements, and if not, is it possible to add one?

[srhise]

+1

The input component should support all the features of a regular input element.

[richstandbrook]

Would be nice if you could set the focus of all elements as well as emitting focus and blur events (#2544).

There is a fairly simple hack to set focus right now:

<el-input type="textarea" ref="myInput"></el-input>

this.$refs.myInput.$refs.textarea.focus()

[Leopoldthecoder]

focus method is supported via #5914. Please wait for our next major version.

[saleh-old]

I can't figure how to use the focus method. Anyone got an example?
@richstandbrook's solution perfectly works though.

[liukun]

@sullyfischer Just this.$refs.myInput.focus() for now

[liang-kai]

this.$nextTick(() => { this.$refs.myInput.focus(); });

[tihomir-kit]

What @liang-kai suggested works. But how would I use the focus method that @Leopoldthecoder mentioned? Thanks.