Summary of experience using element-ui in backend management system

  1. When using el-input to obtain the email address, change the entered Chinese comma into English:
<el-input v-model="form.addressee" :disabled="this.disabled" autocomplete="off"
    @input="form.addressee=form.addressee.replace(/,/g,',')"
    @change="form.addressee=form.addressee.replace(/,/g,',')"
    placeholder="请填写收件人邮箱,不填写认为发送全员(收件人之间请用逗号分隔)!">
</el-input>

Rendering: (Users can enter English commas or Chinese commas)
Insert image description here
2. When selecting a date with el-date-picker, the current day’s date is not selectable.

<el-date-picker
    value-format="yyyy-MM-dd"
    v-model="dataForm.dataDate"
    type="date"
   :clearable="false"
    @change = "changeDate()"
    :picker-options="this.pickerOptions"
    placeholder="选择数据日期">
</el-date-picker>

pickerOptions: {
    
    
  // 只选择今天之前的,不包含今天
  disabledDate(time) {
    
    
     return time.getTime() > Date.now() - 24 * 60 * 60 * 1000;
    },
 }

Rendering: (The day before today’s date is displayed by default)
Insert image description here

// 默认显示前一天逻辑
// 使时间控件默认显示当天
      getNowTime() {
    
    
        var now = new Date(new Date().getTime() - 86400000);
        console.log(now)
        var year = now.getFullYear(); //得到年份
        var month = now.getMonth(); //得到月份
        var date = now.getDate(); //得到日期
        month = month + 1;
        month = month.toString().padStart(2, "0");
        date = date.toString().padStart(2, "0");
        var defaultDate = `${
      
      year}-${
      
      month}-${
      
      date}`;
        this.$set(this.dataForm, "dataDate", defaultDate);
        this.show = ! this.show
      },

Guess you like

Origin blog.csdn.net/weixin_45807525/article/details/123203830