mx-calendar

默认情形

HTML Code:

<mx-view path="app/gallery/mx-calendar/index" />

默认选中某天

HTML Code:

<mx-view path="app/gallery/mx-calendar/index"
    selected="2018-01-01"/>

设置可选择的范围

HTML Code:

<mx-view path="app/gallery/mx-calendar/index"
    min="2017-08-05"
    max="2017-08-22"
    selected="2017-08-12"/>

设置周二为一周的开始

HTML Code:

<mx-view path="app/gallery/mx-calendar/index"
    week-start="<%@ 2 %>"/>

带时分秒

HTML Code:

<mx-view path="app/gallery/mx-calendar/index"
    time-type="all">

带时分秒的选中

HTML Code:

<mx-view path="app/gallery/mx-calendar/index"
    time-type="all"
    selected="2018-08-08 18:08:20"/>

带时分秒,只能选择小时和分钟

HTML Code:

<mx-view path="app/gallery/mx-calendar/index"
    time-type="hour,minute"/>

change事件

HTML Code:

<mx-view path="app/gallery/mx-calendar/index"
    time-type="all"
    selected="2018-08-08 18:08:20"
    mx-change="showDatetime()"/>

Javascript Code:

let Magix = require('magix');
let GTip = require('mx-gtip/index');
module.exports = Magix.View.extend({
    tmpl: '@index.html',
    mixins: [GTip],
    render() {
        let me = this;
        me.updater.digest();
    },
    'showDatetime<change>' (e) {
        this.gtipRT('日期：' + e.date + '，时间：' + e.time);
    }
});