Vue не получает отформатированный момент, если не вызывается local - PullRequest
0 голосов
/ 06 октября 2018

У меня проблемы с получением Vue для обновления.Я нашел обходной путь, но я не понимаю, почему он работает, поэтому я не решаюсь его использовать.

Может кто-нибудь объяснить, почему Vue замечает изменение локального режима, но не час / минутуизменить?

В приведенном ниже коде вы заметите закомментированную строку.//this.time.local();

Если я запускаю это с закомментированной строкой, мой ярлык никогда не обновляется.

Если я отменяю комментарий в строке, Vue внезапно начинает замечать, чтоgettimeString имеет новое значение и соответствующим образом обновляет метку.

Вот мое html тело

<div id="test" name="test">
    <template>
        <v-app>
            <v-text-field v-model="model.timeString"></v-text-field>
            <label>{{model.timeString}}</label>
        </v-app>
    </template>
</div>
<script src="~/Scripts/Test.js"></script>

<script>
    var Vue, vm;
    $(function () {
        vm = new VueModels.Test();
        const vueTest = new Vue({
            el: '#test',
            data: {
                model: vm
            }
        });
        return vueTest;
    });

</script>

и мой файл Test.ts

namespace VueModels {
    export class Test {
        time: moment.Moment = moment.utc('01/01/2001 00:00', 'MM/DD/YYYY HH:mm').tz('US/Eastern');
        get timeString(): string {
            return this.time.format('HH:mm');
        }
        set timeString(value: string) {
            let hour: number = parseInt(value.split(':')[0]);
            let minute: number = parseInt(value.split(':')[1]);
            this.time.set('hour', hour);
            this.time.set('minute', minute);
            //this.time.local();
        }
    }
}

и вотвнешние ресурсы, которые я использую

  <package id="Moment.js" version="2.22.2" targetFramework="net461" />
  <package id="Moment.Timezone.js" version="0.5.13" targetFramework="net461" />
  <package id="moment.TypeScript.DefinitelyTyped" version="1.8.3" targetFramework="net461" />
  <package id="moment-timezone.TypeScript.DefinitelyTyped" version="0.1.2" targetFramework="net461" />

  <script src="https://unpkg.com/vue/dist/vue.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/vuetify/1.0.0-alpha.3/vuetify.min.js"></script>

EDIT:

Я только что понял, что добавление вызова .local () к получателю также работает ... и я теперь еще более запутался

namespace VueModels {
    export class Test {
        time: moment.Moment = moment.utc('01/01/2001 00:00', 'MM/DD/YYYY HH:mm').tz('US/Eastern');
        get timeString(): string {
            this.time.local();
            return this.time.format('HH:mm');
        }
        set timeString(value: string) {
            let hour: number = parseInt(value.split(':')[0]);
            let minute: number = parseInt(value.split(':')[1]);
            this.time.set('hour', hour);
            this.time.set('minute', minute);
        }
    }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...