我遇到的問題不是一個需要修復的問題，所以我很好奇為什么這個功能會發生變化。這段代碼在 Typescript 中，我也在使用 Mobx。
我有一個名為 GlobalPageState 的狀態，有一個屬性selectedTab和一個函式來設定這個名為的屬性setSelectedTab
export default GlobalPageState extends State {
@observable
public selectedTab = string;
@action
public setSelectedTab(selectedTab: PageTab) {
this.selectedTab = selectedTab;
}
}
在我的 react 組件中，我已經解構了這些屬性并將它們參考為：
const { selectedTab, setSelectedTab } = GlobalPageState
const onTabSelect = (newTab: string) => {
setSelectedTab(newTab)
}
這給了我無法設定未定義屬性的錯誤。但是，這有效：
const { selectedTab } = GlobalPageState
const onTabSelect = (newTab: string) => {
GlobalPageState.setSelectedTab(newTab)
}
為什么會出現這種情況，假設其他一切都保持不變？在這種情況下解構函式呼叫是否會以某種方式改變其功能，即參考？沒有顯示的是 GlobalPageState 上正在使用的許多其他函式和屬性，當以這種方式解構時，它們都可以正常作業，所以我不確定為什么這個呼叫會有所不同。謝謝！
uj5u.com熱心網友回復：
基本上你只需要閱讀thisJavaScript https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this 的作業原理
tl; dr：當您將其分配給變數然后不帶點呼叫時，您的函式正在丟失背景關系，例如 class.method()
關于 MobX，你也可以使用，@action.bound盡管我建議堅持使用箭頭函式，因為它是更“原生”的 JS 做事方式。此外，通常最好將所有公共類方法（操作）定義為箭頭函式，這樣您就不必擔心是否解構它們，您可以任意呼叫它們。
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/370086.html