el-input输入框内显示行号

在Element UI库中的`el-input`组件中添加行号功能通常是自定义需求，因为Element本身并不直接支持内置行号展示。你可以通过一些JavaScript或CSS的方式实现这个功能。下面是一个简单的例子：

1. **HTML**:

<template>
  <div>
    <el-input v-for="(item, index) in items" :key="index" placeholder="请输入内容">
      {{ index + 1 }}. {{ item }}
    </el-input>
  </div>
</template>

在这个模板里，我们使用了v-for指令遍历数组，并在每个输入框的值前添加行号。

2. **JavaScript (假设items是数据源)**:

export default {
  data() {
    return {
      items: ['一行', '二行', '三行'],
    };
  },
};

3. **CSS (如果需要调整样式）**:

.el-input__inner::before {
  content: attr(data-row);
  display: inline-block;
  width: 30px; /* 根据需要设置宽度 */
}

这里利用了Vue的绑定属性`data-row`来传递行号，然后在CSS中定位它。

注意这只是一个基础示例，实际应用中可能还需要考虑双向数据绑定、动态更新行号以及处理输入事件等问题。如果你想要更复杂的功能，比如自动递增行号，可能需要编写计算属性或者使用Vue的watcher。