Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/gwt/3.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Oop NativeScript中的MVVM模式-如何使用? 问题_Oop_Nativescript - Fatal编程技术网

Oop NativeScript中的MVVM模式-如何使用? 问题

Oop NativeScript中的MVVM模式-如何使用? 问题,oop,nativescript,Oop,Nativescript,我就是搞不懂NativeScript中的视图模型 我很难理解视图模型在NativeScript中是如何工作的。我理解高层次的概念——MVVM模式允许我们创建可观察的对象——当值发生变化时,我们的UI也会更新 下面是一个简单的例子: main page.js var createViewModel = require("./main-view-model").createViewModel; function onNavigatingTo(args) { var page = args

我就是搞不懂NativeScript中的视图模型

我很难理解视图模型在NativeScript中是如何工作的。我理解高层次的概念——MVVM模式允许我们创建可观察的对象——当值发生变化时,我们的UI也会更新

下面是一个简单的例子:

main page.js

var createViewModel = require("./main-view-model").createViewModel;

function onNavigatingTo(args) {

    var page = args.object;

    page.bindingContext = createViewModel();

}

exports.onNavigatingTo = onNavigatingTo;

var Observable = require("tns-core-modules/data/observable").Observable;

function getMessage(counter) {
    if (counter <= 0) {
        return "Hoorraaay! You unlocked the NativeScript clicker achievement!";
    } else {
        return counter + " taps left";
    }
}

function createViewModel() {
    var viewModel = new Observable();
    viewModel.counter = 42;
    viewModel.message = getMessage(viewModel.counter);

    viewModel.onTap = function() {
        this.counter--;
        this.set("message", getMessage(this.counter));
    }

    return viewModel;
}

exports.createViewModel = createViewModel;

主视图模型.js

var createViewModel = require("./main-view-model").createViewModel;

function onNavigatingTo(args) {

    var page = args.object;

    page.bindingContext = createViewModel();

}

exports.onNavigatingTo = onNavigatingTo;

var Observable = require("tns-core-modules/data/observable").Observable;

function getMessage(counter) {
    if (counter <= 0) {
        return "Hoorraaay! You unlocked the NativeScript clicker achievement!";
    } else {
        return counter + " taps left";
    }
}

function createViewModel() {
    var viewModel = new Observable();
    viewModel.counter = 42;
    viewModel.message = getMessage(viewModel.counter);

    viewModel.onTap = function() {
        this.counter--;
        this.set("message", getMessage(this.counter));
    }

    return viewModel;
}

exports.createViewModel = createViewModel;

var可观测=要求(“tns核心模块/数据/可观测”)。可观测;
函数getMessage(计数器){

如果(counter的答案是,那么这两种方法中的任何一种都应该有效。。您可以将验证或点击功能放在视图模型或代码隐藏文件中,由您决定哪种方法最适合您

如果您将它放在视图模型中,您将使用事件绑定(
tap=“{functionName}}”
,或者如果您将它放在代码隐藏文件中,您将只导出函数名并在XML上引用函数名(
tap=“functionName”


通过提供这种灵活性,您可以分离代码,保持文件的轻量级。

模型在哪里?在android中,我们使用POJO类来定义模型。您能否解释为什么不在这里使用模型。如果您使用{N}核心风格,可观察实例是您的视图模型,它被分配给任何视图(主要是页面)的bindingContext。因此,可观察实例本身就像模型和视图模型一样工作。