【问题标题】:Parent router activate function runs every time its child route is navigated to?每次导航到其子路由时,父路由器激活功能都会运行?
【发布时间】:2015-01-17 04:56:12
【问题描述】:

这可能是代码结构的问题,而不是框架的问题。

基本上我想知道是否应该在每次导航到其子路由之一时调用父路由器上的激活函数?

我的目标: 有一个返回子路由器的模块,这是父路由器。如果用户正在添加新内容,则该父路由器负责创建对象,或者如果用户选择了已经存在的内容,则该父路由器负责从服务器检索数据。子路由模块简单地获取通过父路由模块创建或检索的对象,并提供表单输入来操作该对象(通过 ko 数据绑定)。我遇到的问题是每次子路由导航到时都会调用父路由器的激活函数,这是创建/检索逻辑所在的位置,并导致再次检索对象,从而导致任何数据操作被覆盖。

下面是一些代码,希望能更好地说明:

// ParentRouter
define([...], function(...) {
    var selectedObj = ko.observable(null),
        configRouter = router.createChildRouter()
            .makeRelative({
               moduleId: 'viewmodels',
               fromParent: true,
               dynamicHash: ':id'
            }).map([
                {
                    route: ['Settings 1', ''],
                    moduleId: 'SettingsOne',
                    nav: true
                },
                {
                    route: 'Settings 2',
                    moduleId: 'SettingsTwo',
                    nav: true
                },
                {
                    route: 'Settings 3',
                    moduleId: 'SettingsThree',
                    nav: true
                }
            ]).buildNavigationModel();

    function getSelectedObj() {
        return selectedObj;
    }

    return {
        router: configRouter,

        obj: selectedObj, // privileged property which is accessed by other modules via the getSelectedObj method, this prop gets set in the activate function depending on the param
        getSelectedObj: getSelectedObj, // method which returns the current selected obj

        activate: function (objId) {

            if (objId == 'New') {

                 // create a new object with default props

            } else {

                // retrieve the data for the selected obj from API via the 'objId' param

            }

        }
    }
});



// SettingsOne module - child route module

define(['viewmodels/parentRouter'], function(parentRouter) {

    // this module simply gets a property from the parent routers module and binds it to form inputs in its View (which update automatically) so the user can edit information on that obj


    var obj = parentRouter.getSelectedObj(); // get the current selected obj via parent routers module method

    return {
        obj: obj
    }
});


Below is the shell module of my app, showing the main application router. 
// Shell.js
define([
    'plugins/router'
], function (router) {
    var routes = [
            {
                route: '',
                moduleId: 'viewmodels/home'
            },
            {
                route: ':id*configs',
                moduleId: 'viewmodels/parentRouter'
            }
        ];

    return {
        router: router,
        activate: function () {
            return router.map(routes)
                    .mapUnknownRoutes('viewmodels/notfound', 'not-found')
                    .activate();
        }
    }
});

【问题讨论】:

    标签: javascript durandal


    【解决方案1】:

    我不认为每次在激活孩子之前激活父母有什么问题。如果您不希望 retreval 再次发生,请将其设置为有条件的,例如:

    define(function (require) {
        var
            $ = require('jquery'),
            Q = require('q'),
    
            activate = function () {
                return load();
            },
    
            loadPromise = null,
    
            load = function () {
                return loadPromise || (loadPromise = Q($.get('/my/api'))
                        .then(function (data) {
                            //use data;
                        }));
            };
    
            return {
               activate: activate
            }
    });
    

    【讨论】:

    • 非常感谢。这基本上就是我目前正在做的事情。只是觉得这不是 durandal 设计的吗?
    【解决方案2】:

    我遇到了类似的问题,我不希望我的父虚拟机再次激活它。从 durandal Doc 看来,这听起来应该得到支持:

    From Module Reuse heading here

    如果模块有与之关联的子路由器。实例将被保留。

    这就是说我自己无法让这个工作,但我认为它是针对你的问题。 Durandal 似乎确实尝试支持此功能,但我们都缺少一些细微差别。如果我弄清楚了,我会在这里更新。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2023-04-06
      • 1970-01-01
      • 2018-09-21
      • 1970-01-01
      • 2013-01-13
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多