美文网首页
如何获取Element 中时间组件el-date-picker的

如何获取Element 中时间组件el-date-picker的

作者: 那年角落的喇叭 | 来源:发表于2018-12-02 11:08 被阅读0次

    最近做的一个项目中,需要获取时间控件选择的时间,传给后台,刚开始是通过@change的方法去获取的,不过获取出来的时间格式是中国标准时间,不是YYYY-MM-DD HH:MM:SS 这种格式的。

    • 刚开始是这样写的
    <!-- html 代码块 -->
    <el-date-picker
    v-model="myTime"
    type="datetime"
    @change="getMyDateTime()"
    format="yyyy-MM-ddHH:mm:ss"
    placeholder="选择日期"
    >
    </el-date-picker> 
    
    //java script 代码块
    data(){
        return{
            myTime:null
        }
    },
    methods:{
        getMyDateTime(t) {
          console.log(t);//结果为一个数组,如:2018-12-02T03:24:02.000Z,想要我们需要的时间格式,要进行Date的操作
        }
    }
    
    • 上面这种做法如果我们要获取这种“YYYY-MM-DD HH:MM:SS” 时间格式的时间字符串,还要对其进行处理,这很不方便。所以,后面仔细的查看element的官方文档,原来DateTimePicker 日期时间选择器的 Attributes 中有value-format 这个参数,我们可以通过他来设置我们需要的时间格式,如:“YYYY-MM-DD HH:MM:SS”
    <el-date-picker
    v-model="myTime"
    type="datetime"
    format="yyyy-MM-ddHH:mm:ss"
    value-format="yyyy-MM-ddHH:mm:ss"
    placeholder="选择日期"
    >
    </el-date-picker>    
           
    
    //java script 代码块
    data(){
        return{
            myTime :null
        }
    },
    methods:{
      logMyDateTime{
       console.log(myTime ); 
      }
    }
    

    在Html的el-date-picker的控件中加多value-format, 这样写就不用使用额外的方法去处理他,拿到的数据就是我们想要的

    相关文章

      网友评论

          本文标题:如何获取Element 中时间组件el-date-picker的

          本文链接:https://www.haomeiwen.com/subject/zkcjcqtx.html