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

jum4pzuy  于 2022-11-13  发布在  其他
关注(0)|答案(9)|浏览(202)

Element UI version

2.4.8

OS/Browsers version

windows 7 x64

Vue version

2.5.17

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

Steps to reproduce

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

What is Expected?

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

What is actually happening?

不能输入空格

5f0d552i

5f0d552i1#

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.

nzk0hqpo

nzk0hqpo2#

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

bq3bfh9z

bq3bfh9z3#

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

yruzcnhs

yruzcnhs4#

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

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

更新了啊

ca1c2owp

ca1c2owp5#

暂时可以这样来实现:

<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>
zf9nrax1

zf9nrax16#

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

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

xwbd5t1u

xwbd5t1u7#

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>
eni9jsuy

eni9jsuy8#

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

vaj7vani

vaj7vani9#

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.

相关问题