如何从另一个 js 文件中使用 setActiveTab答案

【问题标题】：How to use setActiveTab from another js file如何从另一个 js 文件中使用 setActiveTab
【发布时间】：2012-10-24 01:07:14
【问题描述】：

我正在尝试使用 TabGroup，然后我想使用另一个 js 文件中的函数 setActiveTab 但出现错误。

单击第三个选项卡中的 button3 时显示未定义 tabGroup。

这是在 app.js 中

var tabGroup = Titanium.UI.createTabGroup()

var window1 = Titanium.UI.createWindow({
    backgroundColor: 'cyan'
})
var window2 = Titanium.UI.createWindow({
    backgroundColor: 'magenta'
})
var window3 = Titanium.UI.createWindow({
    backgroundColor: 'yellow',
    url: 'thirdTab.js'
})

var tab1 = Titanium.UI.createTab({
    //icon
    title: 'First tab',
    window: window1
})
var tab2 = Titanium.UI.createTab({
    title: 'Second tab',
    window: window2
})
var tab3 = Titanium.UI.createTab({
    title: 'Third tab',
    window: window3
})

tabGroup.addTab(tab1)
tabGroup.addTab(tab2)
tabGroup.addTab(tab3)
tabGroup.open()

var button1 = Titanium.UI.createButton({
    title: 'go to second',
    widgh: Titanium.UI.SIZE,
    height: Titanium.UI.SIZE
})
button1.addEventListener('click', function(e){
    tabGroup.setActiveTab(1);
})

var button2 = Titanium.UI.createButton({
    title: 'go to third',
    widgh: Titanium.UI.SIZE,
    height: Titanium.UI.SIZE
})
button2.addEventListener('click', function(e){
    tabGroup.setActiveTab(2);
})

window1.add(button1)
window2.add(button2)

这是在 thirdTab.js 中

var window3 = Titanium.UI.currentWindow

var button3 = Titanium.UI.createButton({
    title: 'go to first',
    widgh: Titanium.UI.SIZE,
    height: Titanium.UI.SIZE
})
window3.add(button3)

button3.addEventListener('click', function(e){
    tabGroup.setActiveTab(0);
})

【问题讨论】：

标签： javascript android url titanium

【解决方案1】：

通过使用 url: 'thirdTab.js' 加载第三个窗口，您正在创建一个单独的 JavaScript 上下文。您可以像创建 window1 和 window2 一样创建 window3，并且可以访问相同的 JavaScript 变量。

为了更好地在 Titanium 中构建您的代码，您应该阅读 CommonJS modules in Titanium。我喜欢的方法，因为它非常像 Titanium-esque，可能是这样的：

app.js

....
var window3 = require('window3').createView(tabGroup);
....

window3.js

exports.createView = function(tabGroup) {
    var win = Ti.UI.createWindow({
        backgroundColor: 'yellow'
    });
    var button = Ti.UI.createButton({
        title: 'go to first',
        width: Ti.UI.SIZE, height: Ti.UI.SIZE
    });
    button.addEventListener('click', function(e){
        tabGroup.setActiveTab(0);
    });
    win.add(button);
    return win;
};

这样您就可以准确地知道传递了哪些变量，以及它们在哪里被使用。

希望这会有所帮助！

【讨论】：