el-input输入框超出显示

如果你的 `el-input` 输入框超出了显示范围，可以尝试以下几种方法：

1. 设置 `width` 属性为固定值或百分比值，例如：`<el-input width="80%"></el-input>`

2. 使用 `max-width` 属性限制输入框的最大宽度，例如：`<el-input max-width="400px"></el-input>`

3. 在父元素上设置 `overflow: hidden`，例如：

   <div style="overflow: hidden;">
     <el-input></el-input>
   </div>

4. 使用 `el-input` 组件的 `autosize` 属性，该属性可以根据输入内容自动调整输入框的高度，例如：

   <el-input autosize></el-input>

此外，你还可以使用 `minRows` 和 `maxRows` 属性来限制输入框的最小和最大行数。

如果以上方法都无法解决问题，你可以考虑使用调试工具（如 Chrome 开发者工具）来检查样式和布局问题。

相关问题

el-input 输入框默认输入内容过长 溢出隐藏 鼠标悬停加上出现悬浮框显示完整内容

您可以使用 CSS 样式来实现这个效果。具体实现步骤如下：

1. 首先给 el-input 输入框设置一个固定的宽度和高度，并设置 overflow: hidden; 让超出部分隐藏。

2. 当鼠标悬停在输入框上时，使用 CSS 选择器 :hover 来显示一个悬浮框，并将悬浮框的内容设置为输入框中的完整内容。

下面是示例代码：

HTML 代码：

<el-input class="input" v-model="inputValue"></el-input>

CSS 代码：

.input {
  width: 200px; /* 设置宽度 */
  height: 20px; /* 设置高度 */
  overflow: hidden; /* 超出部分隐藏 */
}

.input:hover {
  position: relative;
}

.input:hover::before {
  content: attr(value); /* 显示完整内容 */
  position: absolute;
  top: -30px; /* 位置调整 */
  left: 0;
  padding: 5px;
  background-color: #fff;
  border: 1px solid #ccc;
  box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
  z-index: 999;
}

注意：代码中的 value 是 el-input 的一个属性，用于获取输入框中的值。如果使用其他框架或者纯 HTML 实现，请根据具体情况修改代码。

用el-input标签，不用el-input-number标签

如果需要使用 `el-input` 标签实现让用户只能输入 0-100 的数字，可以通过监听输入框的 `input` 事件，并在事件处理函数中对输入的值进行判断和处理。

具体实现方法如下：

<template>
  <el-input v-model="value" @input="handleInput"></el-input>
</template>

在模板中，使用 `el-input` 标签，并绑定一个 `value` 变量和一个 `input` 事件。`value` 变量用于双向绑定输入框的值，`input` 事件用于监听输入框的输入事件。

<script>
export default {
  data() {
    return {
      value: ''
    };
  },
  methods: {
    handleInput(value) {
      // 判断输入的值是否为数字
      if (!/^\d*$/.test(value)) {
        value = this.value;
      }
      // 将输入的值限制在 0-100 的范围内
      if (value < 0) {
        value = 0;
      } else if (value > 100) {
        value = 100;
      }
      this.value = value;
    }
  }
};
</script>

在 JavaScript 中，定义一个 `handleInput` 函数，处理输入框的输入事件。在函数中，首先判断输入的值是否为数字，如果不是数字则将输入框的值重置为之前的值。然后，将输入的值限制在 0-100 的范围内，如果超出了这个范围，则将输入的值重置为 0 或 100。最后，将处理后的值赋值给 `value` 变量，实现输入框的双向绑定。

这样，就可以使用 `el-input` 标签实现让用户只能输入 0-100 的数字了。