null是不是一个对象（评估“this.state.token”）反应母语

问题描述：

我想在一个视图中运行类，但我得到以下错误：null是不是一个对象（评估“this.state.token”）反应母语

null是不是一个对象（评估'this.state.token'）

这是我试着去渲染类：

class BackEnd extends Component{ 
render() { 
    if (this.state.token) { 
    return (
    <ListView dataSource={this.state.users} 
      renderRow={this.renderUsers} 
      style={styles.listView} /> 
); 
    } else { 
    return (
    <View style={styles.container}> 
     <Text style={styles.welcome}> 
     Mobil 
     </Text> 
     <TextInput 
     style={styles.textInput} 
     onChangeText={(username) => this.setState({'username': username})} 
     value= {this.state.username} 
     /> 
     <TextInput 
     secureTextEntry={true} 
     style={styles.textInput} 
     onChangeText={(password) => this.setState({'password': password})} 
     value={this.state.password} 
     /> 
     <TouchableHighlight style={styles.button} onPress={() => this.getToken(config.client_id, config.client_key, this.state.username, this.state.password)}> 
     <Text>Login</Text> 
     </TouchableHighlight> 
     <Text style={styles.error}> 
     {this.state.error} 
     </Text> 
    </View> 
)}; 
} 
}

我在我的组件下面的代码：

export default class AwesomeProject extends Component { 

constructor(props, context) { 
super(props, context) 
this.tabarRef = null 
this.state = { 
    tab: 'item1', 
    text: '', 
    selected2: 'key1', 
    color: 'red', 
    mode: Picker.MODE_DIALOG, 
    token: '', 
    username: '', 
    password: '', 
    error: '', 
    users: new ListView.DataSource(
    { rowHasChanged: (row1, row2) => row1 !== row2, } 
), 
}; 
// this.getToken() = this.getToken().bind(this) 
} 


componentDidMount() { 
    this.loadInitialState().done(); 
} 

async loadInitialState() { 
try { 
let token = await AsyncStorage.getItem('token'); 
if (token !== null) { 
this.setState({ token: token }); 
this.getData(this.state.token); 
} else { 
this.setState({ 'error': 'LogIn' }) 
} 

} catch (error) { 

    } 
} 

async getToken (client_id, client_key, username, password) { 

    var data = new FormData(); 
    data.append('grant_type', 'password'); 
    data.append('client_id', client_id); 
    data.append('client_secret', client_key); 
    data.append('username', username); 
    data.append('password', password); 

    let response = await fetch('https://localhost:8000/o/applications/1/', { 
     method: 'POST', 
     headers: { 
      'Accept': 'application/json', 
      'Origin': '', 
      'Host': 'your-domain.com', 
    }, 
     body: data 
     }); 
     let responseJson = await response.json(); 
     if (responseJson.hasOwnProperty('error')) { 
     this.setState({'error': responseJson.error}); 
     } else { 
     AsyncStorage.setItem('token', responseJson.access_token); 
     this.setState({'token': responseJson.access_token}); 
     this.getData(this.state.token); 
    } 
    } 

async getData(token) { 

    let response = await fetch('https://localhost:8000/o/applications/1/', 
          { 
          method: 'GET', 
          headers: { 
           'Accept': 'application/json', 
           'Authorization': 'Bearer '+token, 
           'Host': 'your-domain.com', 
          }, 
          } 
         ); 
    let responseJson = await response.json(); 
    if (responseJson.hasOwnProperty('detail')) { 
    this.setState({'error': responseJson.detail}); 
    } else { 
    this.setState({'user': this.state.users.cloneWithRows(responseJson)}); 
    } 

}

我调用后端类像这样在我的渲染功能：

case 'item2': 
    content = 
     <View> 
     <BackEnd/> 
     <Text style={styles.instructions}> Hier komt het 
(school)rooster</Text> 
     </View> 
    break

堆栈跟踪：

null不是（评估 'this.state.token'）的对象渲染 C：\用户\曼苏尔\ Documents \ AwesomeProject \ src \ Smartplanner.js：64：21 C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js ：1045：14 measureLifeCyclePerf C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：85：11 _renderValidatedComponentWithoutOwnerOrContext C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：1045：8 _renderValidatedComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js： 1075：10 performInitialMount C：\用户\曼苏尔\文件\ AwesomeProject \ node_modules \反应天然\库\渲染\ SRC \渲染器\共享\堆\调解器\ ReactCompositeComponent.js：484：24 mountComponent C：\用户\曼苏尔\文档\ AwesomeProject \ node_modules \反应母语\ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：346：40 mountComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactReconciler.js：62：6 updateChildren C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactChildReconciler.js： 157：10个 _reconcilerUpdateChildren C：\用户\曼苏尔\文件\ AwesomeProject \ node_modules \反应天然\库\渲染\ SRC \渲染器\共享\堆\调解器\ ReactMultiChild.js：212：10个 _updateChildren C：\用户\曼苏尔\文件\ AwesomeProject \ node_modules \反应天然\库\渲染\ SRC \渲染器\共享\堆\调解器\ ReactMultiChild.js：345：6 updateChildren C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactMultiChild.js：331：25 receiveComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ native \ ReactNativeBaseComponent.js：130：24 receiveComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactReconciler.js：163：38 _updateRenderedComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ SRC \渲染器\共享\堆\调解器\ ReactCompositeComponent。JS：982：8 _performComponentUpdate C：\用户\曼苏尔\文件\ AwesomeProject \ node_modules \反应天然\库\渲染\ SRC \渲染器\共享\堆\调解器\ ReactCompositeComponent.js：944：34 updateComponent Ç ：Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：847：8 receiveComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：710：6 receiveComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactReconciler.js：163：38 upd ateChildren C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactChildReconciler.js：143： _reconcilerUpdateChildren C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactMultiChild.js：212：10 _updateChildren C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactMultiChild.js：345：6 updateChildren C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactMultiChild.js：331：25 receiveComponent C：\ Users \ Mansur \ D ocuments \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ native \ ReactNativeBaseComponent.js：130：24 receiveComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactReconciler.js：163：38 _updateRenderedComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：982：8 _performComponentUpdate C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：944：34 updateComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ L库\ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：847：8 receiveComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：710：6 receiveComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactReconciler.js： 163：38个 updateChildren C：\用户\曼苏尔\文件\ AwesomeProject \ node_modules \反应天然\库\渲染\ SRC \渲染器\共享\堆\调解器\ ReactChildReconciler.js：143：10个 _reconcilerUpdateChildren C：\用户\曼苏尔\文件\ AwesomeProject \ node_modules \反应天然\库\渲染\ SRC \渲染器\共享\堆\ r Econciler \ ReactMultiChild.js：212：10 _updateChildren C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactMultiChild.js：345：6 updateChildren C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactMultiChild.js：331：25 receiveComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ native \ ReactNativeBaseComponent.js：130：24 receiveComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \渲染器\ SRC \渲染器\共享\堆\调解器\ ReactReconciler。JS：163：38 _updateRenderedComponent C：\用户\曼苏尔\文件\ AwesomeProject \ node_modules \反应天然\库\渲染\ SRC \渲染器\共享\堆\调解器\ ReactCompositeComponent.js：982：8 _performComponentUpdate Ç ：Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：944：34 updateComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：847：8 receiveComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：710：6 receiveComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactReconciler.js：163：38 _updateRenderedComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：982：8 _performComponentUpdate C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react- native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：944：34 updateComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：847：8 receiveComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：710：6 receiveComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactReconciler.js：163：38 _updateRenderedComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：982：8 _performComponentUpdate C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：944：34 updateComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：847：8 receiveComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react - 本地\ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：710：6 receiveComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactReconciler.js：163：38 _updateRenderedComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent .js：982：8 _performComponentUpdate C：\ Users \ Mansur \ Documents \ AwesomeProject \ node _modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：944：34 updateComponent C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：847：8 performUpdateIfNecessary C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactCompositeComponent.js：735：8 performUpdateIfNecessary C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactReconciler。js：213：46 runBatchedUpdates C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactUpdates.js：171：6 执行 C ：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ utils \ Transaction.js：149：24 执行 C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ utils \ Transaction.js：149：24 执行 C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactUpdates.js：96：8 flushBatchedUpdates C：\ Users \ Mansur \ Documents \ AwesomeProject \ n ode_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactUpdates.js：199：26 closeAll C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ utils \ Transaction.js：222：29 执行 C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ utils \ Transaction。 JS：163：24个 batchedUpdates C：\用户\曼苏尔\文件\ AwesomeProject \ node_modules \反应天然\库\渲染\ SRC \渲染器\共享\堆\调解器\ ReactDefaultBatchingStrategy.js：65：33个 batchedUpdates ç ：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ shared \ stack \ reconciler \ ReactUpdates.js：111：41 _receiveRootNodeIDEvent C：\用户\曼苏尔\文件\ AwesomeProject \ node_modules \反应天然\库\渲染\ SRC \渲染\天然\ ReactNativeEventEmitter.js：126：32个 receiveTouches C：\用户\曼苏尔\文件\ AwesomeProject \ node_modules \ react-native \ Libraries \ Renderer \ src \ renderers \ native \ ReactNativeEventEmitter.js：213：8 __callFunction C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ BatchedBridge \ MessageQueue。 js：242：47 C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ BatchedBridge \ MessageQueue.js：108：26 guard C：\ Users \ Mansur \ Documents \ AwesomeProject \ node_modules \ react-native \ Libraries \ BatchedBridge \ MessageQueue.js：46：4 callFunctionReturnFlushedQueue C：\用户\曼苏尔\文件\ AwesomeProject \ node_modules \反应天然\库\ BatchedBridge \ MessageQueue.js：107：10

我怎样才能解决这个问题？

答

移动状态在构造组件级到状态。

奥克，但那不会解决问题 –

null是不是一个对象（评估“this.state.token”）反应母语

相关推荐