繁体   English   中英

解析:JavaScript Promises问题

[英]Parse: JavaScript Promises issue

我试图围绕Promises, thenwhen ,以及它所伴随的所有其他事情。 我没有太大的成功。 这是我要用英语完成的工作,也许有人可以破解代码,因为到目前为止我还没有写过任何作品。

我正在为移动设备编写SPA(单页应用程序)。 本质上,所有内容都是一个带有大量DIV的巨型HTML页面。 但是,一次仅显示一个DIV。 用户将具有一个标签栏,以单击每个图标以显示/隐藏DIV。 可以考虑一下Apple App Store界面,其底部带有“功能”,“热门图表”,“浏览”,“搜索”和“更新”。

  1. 使用AppUrl=example.com解析1个企业的表Businesses数据库查询
  2. 产生的业务objectId用于查询表Navigation的所有导航内容。 诸如“首页”,“关于我们”,“菜单”,“事件”,“联系方式”等内容。
  3. 循环生成的导航项以呈现其中包含内容的DIV。 内容来自下表,具体取决于“ Module列:
    • “主页” = Photos
    • “关于我们” = Pages
    • “菜单” = Lists
    • “事件” = Lists

基本上就是这样。 非常简单,但是显然#4中存在嵌套查询。 我不知道是否应该在查询中创建一个巨型对象然后输出该对象? 还是创建一堆内部带有数组的不同对象? 由于这种语法风格与PHP不同,因此确实有点迷失了。 建议吗?

这是我的非数据库连接版本:

app.get('/', function(req, res){

var frontpageImages = [
        { caption:"Eggplant, Prosciutto, and Pesto Pressed Sandwiches.", file:"image01.jpg", position:"15%" },
        { caption:"Pico de Gallo", file:"image02.jpg", position:"75%" },
        { caption:"B.L.A.T Croque Madame", file:"image03.jpg", position:"20%" },
        { caption:"Double Oreo Brownie Cupcake", file:"image04.jpg", position:"80%" },
        { caption:"Baked Chicken Chimichangas with Monterey Jack Cheese Sauce", file:"image05.jpg", position:"20%" }
        ]

var menu = [
        { divider:"Appetizers" },
        { name:"French Fries", picture:"menu-french-fries", subname:"$4.95" },
        { name:"Loaded Cheese Fries", picture:"menu-cheese-fries", subname:"$7.95" },
        { name:"Gaelic Chips", picture:"menu-gaelic-chips", subname:"$2.95" },
        { name:"Jalapeno Mac n' Cheese", picture:"menu-jalapeno-mac-n-cheese", subname:"$4.95" },
        { name:"Chicken Wings", picture:"menu-chicken-wings", subname:"$8.50" },
        { name:"Irish Nachos", picture:"menu-irish-nachos", subname:"$8.50" },
        { name:"Black & Tan Onion Rings", picture:"menu-onion-rings", subname:"$6.95" },
        { name:"Mac's Quesadillas", picture:"menu-quesadillas", subname:"$8.50" },
        { name:"Banger Bites", picture:"menu-banger-bites", subname:"$7.95" },
        { divider:"Salads" },
        { name:"Caesar Salad", picture:"menu-caesar-salad", subname:"$6.50" },
        { name:"House Salad", picture:"menu-house-salad", subname:"$6.50" },
        { name:"Buffalo Chicken Salad (Grilled or Battered)", picture:"menu-buffalo-chicken-salad", subname:"$8.95" },
        { divider:"Sandwiches & Burgers" },
        { name:"Rueben", picture:"menu-reuben", subname:"$8.50" },
        { name:"Dublin Corned Beef", picture:"menu-corned-beef-sandwich", subname:"$8.50" },
        { name:"Philly Cheese Steak", picture:"menu-philly-cheese-steak", subname:"$8.50" },
        { name:"Grilled Chicken", picture:"menu-grilled-chicken-sandwich", subname:"$8.50" },
        { name:"Club Sandwich", picture:"menu-club-sandwich", subname:"$8.50" },
        { name:"Not-So-Irish Burger", picture:"menu-irish-burger", subname:"$9.95" },
        { name:"Dirty Burger", picture:"menu-dirty-burger", subname:"$7.95" },
        { name:"Aurora Burger", picture:"menu-aurora-burger", subname:"$10.95" },
        { name:"Bleu Cheese Burger", picture:"menu-bleu-cheese-burger", subname:"$11.95" },
        { name:"Additional Burger Toppings", picture:"menu-burger-toppings", subname:"$0.50" },
        { divider:"Irish Favorites & Entrees" },
        { name:"Beer Battered Fish N' Chips", picture:"menu-fish-and-chips", subname:"$11.50" },
        { name:"Bangers And Mash", picture:"menu-bangers-and-mash", subname:"$10.95" },
        { name:"Shepherd's Pie", picture:"menu-shepherds-pie", subname:"$10.95" },
        { divider:"Brunch" },
        { name:"Irish Breakfast", picture:"menu-irish-breakfast", subname:"$11.50" },
        { name:"American Breakfast", picture:"menu-american-breakfast", subname:"$11.50" },
        { name:"Irish Breakfast Roll", picture:"menu-irish-breakfast-roll", subname:"$8.95" },
        { name:"English Muffin, Scrambled Eggs, Cheddar and Irish Rasher", picture:"menu-irish-rasher", subname:"$7.50" },
        { name:"3 Egg Omelette", picture:"menu-omelette", subname:"$6.50" },
        { name:"Eggs Benedict", picture:"menu-eggs-benedict", subname:"$8.50" },
        { name:"3 Pancakes with Maple Syrup", picture:"menu-pancakes", subname:"$6.00" },
        { name:"Grilled Turkey and Swiss", picture:"menu-grilled-turkey-and-swiss", subname:"$7.00" }
        ];

var drinks = [
        { name: "Bahama Bomb", desc: "Bacardi 151 Rum, Cruzan Coconut Rum, Creme de Banana, Pineapple juice, and Sprite.", subname: "$9.95" },
        { name: "Tropical Margarita", desc: "Grand Marnier, Cruzan Coconut Rum, Blue Curacao, sour mix, and orange juice. Garnished with lemon, lime, and cherry.", subname: "$10.95" },
        { name: "LOL[emonade]", desc: "Absolute Citron, Triple Sec, muddled lemon and simple syrup, sour mix, and Sprite.", subname: "$9.95" }
        ];

var events = [
        { divider:"Upcoming Events" },
        { name: "Super Bowl Party", subname: "1/28" },
        { name: "Valentine's Singles Party", subname: "2/14" },
        { divider:"Weekly Events" },
        { name: "Hospitality Night", subname: "Monday" },
        { name: "Trivia Night", subname: "Tuesday" },
        { name: "Karaoke with Liam", subname: "Thursday" }
        ];

res.render('index', {
    nav:[
        { name:"Home", title:"Clark's Bar and Grille", url:"home", icon:"home", module:"home", run:"startSlider", source:frontpageImages },
        { name:"Menu", url:"menu", icon:"cutlery", module:"list", source:menu },
        { name:"Drinks", url:"drinks", icon:"glass", module:"list", source:drinks },
        { name:"Events", url:"events", icon:"calendar", module:"list", source:events },
        { name:"Restaurant Info", title:"Restaurant Info", url:"business-info", icon:"info-circle", module:"business-info" },
        { name:"Instagram Feed", title:"Instagram", url:"instagram", icon:"instagram", module:"instagram", run:"startInstagram" },
        { name:"Like and Follow Us", title:"Social Media", url:"social-media", icon:"thumbs-up", module:"social-media-links" },
        { name:"Contact Clark's", title:"Contact Clark's", url:"contact", icon:"envelope", module:"contact" }
        ]
});

});

当页面现在呈现时,我让index.ejs循环nav对象并显示每个DIV(主菜单,菜单,饮料,事件等)。 nav对象内的每个数组都有一个称为source的键,该键返回上面列出的对象。 页面呈现完美,只是没有连接到数据库。 我想将所有这些换成与数据库连接的版本!

希望这段代码对您有所帮助,这是我所建议的最好的:

function handleError(message, error) {
    //Handle any error here, for example:
    console.error(message, error);
    res.send(500, message);
}

var responseContent = {
    nav: [],
};

getBusiness(); //start fetching data

function getBusiness() {
    var businessQuery = /*query to get element AppUrl=example.com*/;
    businessQuery.first().then(
        getNavigation,
        handleError.bind(null, 'error getting business'));
}

function getNavigations(business) {
    var navigationsQuery = /*query to get navigation elements*/;
    var promises = [];
    navigationsQuery.each(function (navigation) {
        promises.push(processNavigation(navigation));
    }).then(
        function () {
            Parse.Promise.when(promises).then(
                renderResult,
                handleError.bind(null, 'error processing navigations'));
        },
        handleError.bind(null, 'error iterating navigations'));
}

function processNavigation(navigation) {
    var promise = Parse.Promise();
    var nav = {
        name: /*name*/,
        url: /*url*/,
    };
    responseContent.nav.push(nav);
    switch (/*module*/) {
        case 'Home':
            getPhotosContent(/*args*/).then(
                function (source) {
                    nav.source = source;
                    promise.resolve();
                },
                function (error) {
                    promise.reject(error);
                }
            );
            break;
        //can do similar code for 'About Us', 'Menus', ...
        default:
            promise.resolve();
    }
    return promise;
}

function getPhotosContent(/*args*/) {
    var promise = Parse.Promise();
    var results = [];
    var photosQuery = /*query to get photos*/;
    photosQuery.each(function (photo) {
        results.push(photo);
    }).then(
        function () {
            promise.resolve(results);
        }, function (error) {
            promise.reject(error);
        }
    );
    return promise;
}

function renderResult() {
    res.render('index', responseContent);
}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM