element ui 表单使用插槽提高鼠标用户的用户体检

1.应用场景

效果是这样的：

如果不是用的elementui框架，代码结构是这样的：

<label for="SSN">表单名称</label>
<input type="text"  id="SSN" />

但是elementUi却不是这样的

2.实现

        <el-form-item prop="packName" style="margin: 24px 0">
          <span slot="label">表单名称</span>
          <el-input
            id="packName"
            placeholder="请输入内容"
            v-model="search.packName"
            style="width: 220px"
            clearable
          >
          </el-input>
        </el-form-item>

需要用到的是插槽。注意的是，这里el-input的 id属性值要和el-form-item的prop属性值一致