如何從React-Native的另一個類中調用一個函數？

我上反應原生的工作，我想打電話給來自不同類的功能，但是當我試圖做它的顯示一些錯誤。如何從React-Native的另一個類中調用一個函數？

A類

import B from './B.js'; 

class A extends Component { 
    _onItemPressed(item){ 
     B.abc(); 
    } 

    render() { 
     return (
     <TouchableHighlight 
      underlayColor={Colors.colors.lightgrey} 
      style={{padding: 15}} 
      onPress={this._onItemPressed.bind(this)}> 
     <Text>Click Me !</Text> 
     </TouchableHighlight> 
    ); 
    } 
}

B類

class B extends Component { 

    abc(){ 
     alert('Hello World'); 
    } 

    render() { 
     return (
     <View> 
      <Text>Welcome to React Native</Text> 
     </View> 
    ); 
    } 
}

但是錯誤消息中的一類按下按鈕後到來， '未定義不是函數（評價' B .default._abc（） '）'

PLE我善意地通過我的帖子，並建議我一些解決方案。

感謝

來源

2017-04-27 Deeptiman Pattnaik

你想直接使用組件類嗎？您需要實例化類或將方法更改爲靜態以便能夠調用它。 – fubar

嘿謝謝，但我想使靜態函數，沒有靜態你知道如何訪問這個函數 –

我可以看到你沒有導出B類，你只能進口。請嘗試在B類文件的底部，像這樣export default B添加export聲明。

希望這有助於

來源

2017-04-27 16:03:56

你不開始你的類，要解決這個你需要改變B.abc()到new B().abc();

來源

2017-07-13 14:28:07

製作ABC功能的靜態和出口B級。

export default class B extends Component { 

    static abc(){ 
     alert('Hello World'); 
    } 
}

來源

2017-07-13 14:53:37 pravdomil

我注意到你沒有出口類B.嘗試

class B extends Component { 
    static abc(){ 
    alert('Hello World'); 
    }} 
export default B

然後將它導入A類

import B from './B';

讓我知道這是否爲你工作。

來源

2017-08-02 11:40:39

你有兩個選擇，要麼使用一個對象或使用類的名稱，讓我們先從對象

class B { 
    abc() { 
    alert("Hello World"); 
    } 
} 
const b = new B(); 
export default b;

所以，當你調用這個文件，你可以訪問功能ABC像下面

import b from './B.js'; 
class A extends Component { 
    _onItemPressed(item){ 
     b.abc(); 
    } 
...

另一種方法是使用類，而不是作爲跟隨

class B{} 
B.abc = function(){ 
    alert("Hello World"); 
} 
module.exports = { 
    functions: B 
};

所以，當你調用這個文件，您可以訪問功能ABC像下面

import b from './B.js'; 
class A extends Component { 
    _onItemPressed(item){ 
     b.functions.abc(); 
    } 
...

注：B級不應該是一個組件，您可以使用它作爲一個輔助類。

也可以提升你使用Singleton模式處理的對象的方式，因爲我在 React native- Best way to create singleton pattern

UPDATE已經提及：如果你堅持使用，而不是一類的功能組件，你可以叫它通過參考，如下所示：現在

export default class B extends Component { 
    constructor(props) { 
    super(props); 
    this.abc = this.abc.bind(this); 
    } 
    abc(){ 
     alert('Hello World'); 
    } 

    render() { 
     return null 
    } 
}

在可以通過參考調用B A成分

import B from "./B.js"; 
class A extends Component { 
    _onItemPressed(item) { 
    this._b.abc(); 
    } 
    render() { 
    return (
     <TouchableHighlight 
     underlayColor={Colors.colors.lightgrey} 
     style={{ padding: 15 }} 
     onPress={this._onItemPressed.bind(this)} 
     > 
     <Text>Click Me !</Text> 
     <B ref={ref => (this._b = ref)} /> 
     </TouchableHighlight> 
    ); 
    } 
}

來源

2018-02-11 01:47:01

您必須使用構造函數創建父級，訪問超級方法以便很好地擴展組件類，然後導出父級並將其擴展到Class A，您可以通過此類上下文訪問此類功能

export default class B extends Component { 
    constructor(props){ 
     super(props); 
    } 
    abc(){ 
     alert('Hello World'); 
    } 

    render() { 
     return (
      <View> 
       <Text>Welcome to React Native</Text> 
      </View> 
     ); 
    } 
} 






import B from './B.js'; 

export default class A extends B { 

    _onItemPressed(item){ 
     this.abc(); 
    } 

    render() { 
     return (
      <TouchableHighlight 
       underlayColor={Colors.colors.lightgrey} 
       style={{padding: 15}} 
       onPress={this._onItemPressed.bind(this)}> 
       <Text>Click Me !</Text> 
      </TouchableHighlight> 
     ); 
    } 
}

來源

2018-02-11 13:18:22 FPast

如何從React-Native的另一個類中調用一個函數？

回答

相關問題