el-table单选框

el-table单选框实现

  <el-table
    v-loading="loading"   //调用接口时开启loading成功后关闭
    :data="addressList"  //绑定接口返回的数据
    min-height="150"    //最小高度
    max-height="400"   //最大高度
    border            //开启边框
    selectable
    filter-multiple
  >
   <el-table-column
     width="55"
   >
   /**插槽**/
   <template slot-scope="scope"> 
     <!-- label值要与el-table数据id实现绑定 -->
      <el-radio
        v-model="unitInfoUserId"
        :label="scope.row.id"
         @change="handleRowChange(scope.row)"
        >{{ "" }}</el-radio>
     </template>
    </el-table-column>
    data(){
     return{
           loading, //遮罩层
           unitInfoUserId:null,//单选框绑定的id
        }
     }
    methods:{
     // 获取到当前选择项的数据
    handleRowChange(data) {
     this.unitInfoUserId = data.id
    },
   }  

时间组件

<el-date-picker
  v-model="form.logon"
  style="width:70%;"
  type="date"
  :picker-options="pickerOptions "//禁止选择的日期
  clearable
  value-format="yyyy-MM-dd"
  placeholder="选择日期"
/>
data（）{
return{
 pickerOptions: {
     disabledDate(time) {// 只能选择当前时间之前的时间
       return time.getTime() > Date.now()
     }
   },
      pickerOptions: {
  disabledDate: (time) => { // 限制不能选择小于当前日期
       return time.getTime() < Date.now() - 1 * 24 * 3600 * 1000
     }
   },
  }
}