渲染功能將無法用於側邊欄

Question

我正在關注https://www.npmjs.com/package/react-native-sidebar以實施側邊欄。 I'm getting this error刷新我的iOS模擬器。我按照現在的方向，但在我的WebStorm IDE這是說Unresolved function or method renderLeftSideBar()和Unresolved function or method renderLeftSideBar()。

下面的代碼：

import React, { Component } from 'react'; 
import { AppRegistry} from 'react-native'; 
import { Provider } from 'react-redux'; 
import Application from './pages/Application'; 
import store from './redux'; 
import api from './utilities/api'; 
import SideBar from 'react-native-sidebar'; 

export default class DApp extends Component { 
    constructor(props) { 
     super(props); 
     this.state = { 
      data: [], 
      isLoading: true 
     } 
     console.log("something"); 
    } 

    componentWillMount() { 
     api.getData().then((res) => { 
      this.setState({ 
       data: res.data 
      }) 
     }); 
    } 

    renderLeftSideBar() { 
    return(
     <Text>Someting here for left side bar!</Text> 
    ); 
} 

renderRightSideBar() { 
    return(
     <Text>Someting here for right side bar!</Text> 
    ); 
} 

renderContent() { 
    return(
     <Text>The content!</Text> 
    ); 
}  

    render() { 
     if(this.state.isLoading) { 
      console.log("The data is: " + this.state.data); 
     } else { 
      console.log("Else got executed"); 
     } 

     return (

      <Provider store={store}> 
       <SideBar> 
        leftSideBar = {this.renderLeftSideBar()} 
        rightSideBar = {this.renderRightSideBar()} 
        style = {{flex: 1, backgroundColor: 'black'}}>{this.renderContent()} 
       </SideBar> 
       <Application /> 
      </Provider> 
     ); 
    } 
} 

AppRegistry.registerComponent('DApp',() => DApp); 

Answer 1

你的類DAPP不具備的功能renderLeftSideBar();這就是爲什麼你的功能是unresolved。

要解決此問題，您需要創建一個函數renderLeftSideBar()，該函數返回左側欄的內容。閱讀鏈接的文檔顯示，leftSideBar是Component類型。

leftSidebar：Compontent

通常，我將定義上述render()的功能。

renderLeftSideBar() { 
    return <div> 
     (content goes here) 
    </div> 
}