[Bug Report] input component (type=text) can not enter spaces in el-menu.

[az1981cn]

Element UI version

2.4.8

OS/Browsers version

windows 7 x64

Vue version

2.5.17

Reproduction Link

https://jsfiddle.net/mmx38qxw/6764/

Steps to reproduce

当input在el-menu中，并且mode为"horizontal"时，input中不能输入空格。

What is Expected?

可以输入空格及任意字符（enter当然例外）

What is actually happening?

不能输入空格

[element-bot]

Translation of this issue:

Element UI version 2.4.8

OS/Browsers version Windows 7 X64

Vue version 2.5.17

Reproduction Link https://jsfiddle.net/mmx38qxw/6662/

Steps to reproduce When input is in el-menu and mode is "horizontal", space can not be entered in input.

What is Expected? You can enter spaces and any characters (enter, of course).

What is actually happening? Unable to enter space.

[az1981cn]

el-menu的mode不是horizontal时，input中可以输入空格。

[elfman]

@az1981cn 你这fiddle里的代码完全不能运行啊

[az1981cn]

@az1981cn 你这fiddle里的代码完全不能运行啊

https://jsfiddle.net/mmx38qxw/6764/

更新了啊

[dive2Pro]

暂时可以这样来实现:

 <el-menu-item index="1">
    <el-input 
              v-model="keyword" 
              type="text" 
              placeholder="请输入搜索内容"
              @keyup.native.input="keyword = keyword + ' '"
              clearable
              autofocus>
    </el-input>
  </el-menu-item>

[WayneGongCN]

导致 Bug 的原因是由于 mode=“horizontal” 时会为每一个 menu-item 添加 keydown 的事件处理。 例如用方向键选择子菜单，按空格或回车键确认。

当 menu-item 中的 input 触发 keydown 事件时被错误处理。

[sandoche]

For english speakers here is the fix:

 <el-menu-item index="1">
    <el-input 
              v-model="myVar" 
              type="text" 
              @keyup.native.space="myVar= myVar+ ' '"
              clearable
              autofocus>
    </el-input>
  </el-menu-item>

[az1981cn]

2.4.8的bug，现在2.13.1了，仍然存在。效率不是一般的低啊！

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.