Блог

Это код, который я изменил из репозитория zeroconf на github. Я изменил componentdidmount на useeffect и добавил некоторые состояния использования в исходном коде. Пожалуйста, помогите решить эту проблему

Ошибка типа: null не является объектом (оценка ‘RNZeroconf.scan’)

Один из потоков в stackoverflow говорит отсоединить expo, чтобы это работало с expo. Я не понимаю, что это значит, и будет ли это возможным способом заставить это работать?

 import { StatusBar } from 'expo-status-bar'; import React,{useState,useEffect} from 'react'; import { StyleSheet, Text, View,Button,SafeAreaView,FlatList,RefreshControl } from 'react-native'; import Zeroconf from 'react-native-zeroconf'  export default function App() { const zeroconf = new Zeroconf() const [states,setStates]= useState ({  isScanning: false,  selectedService: null,  services: {}, }) useEffect(() =gt; {    console.log("started")    refreshData()  zeroconf.on('start', () =gt; {  setStates({ isScanning: true })  console.log('[Start]')  })  zeroconf.on('stop', () =gt; {  setStates({ isScanning: false })  console.log('[Stop]')  })  zeroconf.on('resolved', service =gt; {  console.log('[Resolve]', JSON.stringify(service, null, 2))  setStates({  services: {  ...states.services,  [service.host]: service,  },  })  })  zeroconf.on('error', err =gt; {  setStates({ isScanning: false })  console.log('[Error]', err)  })  console.log('mount it!'); }, []); renderRow = ({ item, index }) =gt; {  const { name, fullName, host } = states.services[item]  return (  lt;TouchableOpacity  onPress={() =gt;  setStates({  selectedService: host,  })}  gt;  lt;ListItem title={name} subtitle={fullName} /gt;  lt;/TouchableOpacitygt;  ) } refreshData = () =gt; {    const { isScanning } = states  if (isScanning) {  return  }  setStates({ services: [] })  console.log(states)  zeroconf.scan('http', 'tcp', 'local.')  clearTimeout(this.timeout)  this.timeout = setTimeout(() =gt; {  console.log("timer Stopped")  zeroconf.stop()  }, 10000) }  const { services, selectedService, isScanning } = states  console.log(selectedService)  const service = services[selectedService]  if (service) {  return (  lt;SafeAreaView style={styles.container}gt;  lt;TouchableOpacity onPress={() =gt; setStates({ selectedService: null })}gt;  lt;Text style={styles.closeButton}gt;{'CLOSE'}lt;/Textgt;  lt;/TouchableOpacitygt;  lt;Text style={styles.json}gt;{JSON.stringify(services, null, 2)}lt;/Textgt;  lt;/SafeAreaViewgt;  )  }  else{  return (  lt;SafeAreaView style={styles.container}gt;  lt;Text style={styles.state}gt;{isScanning ? 'Scanning..' : 'Stopped'}lt;/Textgt;  lt;FlatList  data={Object.keys(services)}  renderItem={renderRow}  keyExtractor={key =gt; key}  refreshControl={  lt;RefreshControl  refreshing={isScanning}  onRefresh={refreshData}  tintColor="skyblue"  /gt;  }  /gt;  lt;/SafeAreaViewgt;  )} } const styles = StyleSheet.create({  container: {  flex: 1,  backgroundColor: '#fff',  alignItems: 'center',  justifyContent: 'center',  }, });