ボタンのハンドラをJavascriptの別の配列にコピーする方法

Question

基本的に私は2つのメニューを持っています.1つはデフォルトのボタン用で、もう1つは既にクリックされたボタン用です。ユーザーは次のように動作する必要があります。ユーザーがメニューAを開きます。メニューAには6つのボタンがあります。彼らはボタンの1つを選択し、そのボタンは今メニューBにコピーされます。選択されたボタンは動作し、メニューAとメニューBの両方に同じように表示されます。これを行うには、循環参照、無限ループ、または "x.render（）は関数ではありません"エラーを取得しています。

function btn(txt, font) { 
var temp = {}; 
temp.xtype = "button"; 
temp.text = txt; 
temp.handler = function (btn) { 
    btn.up("button").menu.style = font; 
    btn.up("button").down("#menuB").items.items.push(new btn(txt, font)); 
}; 
return temp; 
} 

Answer 1

あなたは非メニューの変更のすべてを分離することができます：ここで

は、私は（私は他のメニューにそれをプッシュする場合を除いて、正常に動作している）元々のボタンを生成するためのメニューAに呼び出す機能ですあなたのハンドラの一部なので、のような：

const handlers = { 
    firstHandler(btn) { 
     doWhateverFirstButtonDoes(btn); 
    }, 
    secondHandler() { ... 
}; 

次に、あなたが最初のメニュー上のすべてのボタンは、「2番目のメニューに追加」機能を分離することができます：

addToSecondMenu = function(btn) { 
    // I'm not clear where txt/font come from, but if you have the btn 
    // presumably you can get the right txt/font for it 
    btn.up("button").menu.style = font; 
    btn.up("button").down("#menuB").items.items.push(new btn(txt, font)); 
} 

その後

、あなたが最初のメニューをバインドするとき、次の2つを組み合わせることができます：

firstMenuButon.onClick = function(e) { 
    handlers.firstHander(e.target); 
    addToSecondMenu(e.target); 
} 

次に、2番目のメニューで、あなただけのaddToFirstMenuで、同じことを行うことができます

addToFirstMenu = function(btn) { 
    // I'm not clear where txt/font come from, but if you have the btn 
    // presumably you can get the right txt/font for it 
    btn.up("button").menu.style = font; 
    btn.up("button").down("#menuA").items.items.push(new btn(txt, font)); 
} 

firstMenuButonOnMenuB.onClick = function(e) { 
    handlers.firstHander(e.target); 
    addToFirstMenu(e.target); 
} 

私はあなたのコードをすべて見ずにはっきり言うことはできませんが、「ボタンが本当にやること」ロジックを「メニューからのボタンの追加と削除」ロジックから分離することで、記述した問題の種類を避けることができるはずです。