Iconfont - 给placeholder动态绑定图标

1. 效果展示：

2. 问题描述：

ElementUI的时间日期选择框，默认的时钟icon在左边，而需求是使用自定义的图标，并跟随提示语居中。因此可以考虑用InnerHTML的思路，在el-date-picker时间日期选择器的placeholder提示语里加上iconfont编码，使其自动识别为iconfont图标

3. 实现方法：

(1) ★给placeholder绑定变量（此处注意，直接赋值placeholder=' \ue6a1 请选择时间'的话无法显示图标）
html:

<el-date-picker
  v-model="value1"
  type="datetime"
  :placeholder="tip">
</el-date-picker>

ts:

export default class extends Vue {
  tip = ' \ue6a1  请选择时间'
}

(2) 变量里，图标格式为\u + unicode(4位)
例如，iconfont的图标为content: \e6a1,那么这变量就要写\ue6a1

(3) css样式，给::placeholder加上iconfont的font-family（不加的话，图标会变成一个方块）

.el-date-editor .el-input__inner {
    &::placeholder {
      font-family: "iconfont";
      display: flex;
      align-items: center;
      justify-content: center;
      color: rgb(51, 102, 153);
    }
}

---

Do what you can, with what you have, where you are.
在你所处的位置，用你所有的资源，做你力所能及的事。(西奥多·罗斯福)