javascript - Titanium/Appcelerator - 使用时间选择器，生成具有本地时差的日期对象

Question

我正在使用选择器 (Ti.UI.Picker) 并将类型设置为 Ti.UI.PICKER_TYPE_TIME。目的是允许用户更改数据库中日期条目的时间。该日期存储在 UTC 时间戳中。流程如下:

1. 用户打开 Controller
2. 使用 moment.utc() 方法从数据库中提取日期，并将其存储为 Moment JS 日期对象。
3. 用户选择打开选择器更改时间
4. moment.toDate() 方法用于将所需的日期对象传递给选择器
5. 选择器打开时显示的时间已根据手机上的时区设置进行更正，例如:+1 小时。
6. 当用户完成后，选择器返回一个日期对象，并且结果时间不是他们选择的时间；在本例中为 -1 小时。

我认为通过使用 moment.utc() 我可以避免这种情况。但也许选择器会使用普通的 JavaScript 日期对象执行一些内部操作，从而及时进行调整。

有办法解决这个问题吗？我的目标是；如果原始时间是 13:00，我希望选择器以 13:00 打开，那么如果用户将其更改为 15:00，我希望选择器的结果为 15:00 并且相应的标签显示为15:00。

这是一些示例代码

var moment = require('alloy/moment');

var time_unix = 1396815002000;
var date_obj = moment.utc(time_unix);

function updateTimeLabel() {
    $.timeLabel.setText(date_obj.format('HH:mm'));
}

function onTimeClick() {
    var pickerView = Titanium.UI.createView({
        backgroundColor: "#FFF",
        height: 280,
        bottom :-280,
        zIndex: 1000
    }); 
    var cancel = Ti.UI.createButton({
        title:'Cancel',
        style: Ti.UI.iPhone.SystemButtonStyle.BORDERED
    }); 
    var done = Ti.UI.createButton({ 
        title:'Done',   
        style: Ti.UI.iPhone.SystemButtonStyle.DONE
    });     
    var spacer = Ti.UI.createButton({
        systemButton: Ti.UI.iPhone.SystemButton.FLEXIBLE_SPACE
    });
    var toolbar = Ti.UI.iOS.createToolbar({
        top: 0,
        barColor: '#000',
        items:[cancel,spacer,done]
    });
    var picker = Ti.UI.createPicker({
        type: Ti.UI.PICKER_TYPE_TIME,
        value: date_obj.toDate(), // does the problem occur here?
        minDate: new Date('1950-01-01'),
        maxDate: new Date('2050-01-01'),
        top: 45
    });
    cancel.addEventListener('click', function () {
        console.log('cancel pressed');
        pickerView.animate({bottom: 0, duration: 500});
    });
    done.addEventListener('click', function (evt) {
        date_obj = moment.utc(picker.getValue());
        updateTimeLabel(); // result is 1 hour less than picker
        pickerView.animate({bottom: -280, duration: 500});
    });
    pickerView.add(toolbar);
    pickerView.add(picker);
    $.win.add(pickerView);
    // picker opens with time that is +1 hour
    pickerView.animate({bottom: 0, duration: 500});
}


$.win.open();
updateTimeLabel();

屏幕截图

Answer 1

就我而言，我使用时刻格式方法以及简单的日期和时间设置默认值:

picker.setValue(moment(someTime).format("YYYY-MM-DD"));

对于时间选择器:

picker.setValue(moment(someTime).format("HH:mm"));

效果很好