Reactjs componentDidMount中的意外标记导出为默认值

我试图使用componentDidMount和exporting作为默认值，但我得到了错误。意外标记，应为“，”。当我使用导出默认类HelpScreen extensed React.Component{}时，该代码可以工作，但我需要使用const HelpScreen=（）=>{}。这是我的密码：

const HelpScreen = () => {
state = {
    measure: [],
    
} 


componentDidMount () {
    api.get('measures/shower/' + this.state.idShower).then(res => {
        this.setState({measure: res.data.measures})
    }
};
return(
    <View style={styles.screen}>
        <Header></Header>
        <View>
            {this.state.measure.map( function(data, index) {
                return(
                    <View>
                        <Text>{data.startTime} seconds</Text>
                    </View>
                )
            })}
        </View>
        <Dropdown/>
    </View>
)

也没有成功。

---

感谢所有回复。

在useEffect中传递一个空数组，以获得与componentDidMount类似的功能

useEffect(()=>{
   // CODE
},[])

可以通过收听屏幕导航使其更加复杂

useEffect(() => {
    const screen_focus = navigation.addListener('focus', () => {
      // CODE
    });

    // Return the function to unsubscribe from the event so it gets removed on unmount
    return screen_focus;
  }, [navigation]);

尝试这种方式（更新）

const HelpScreen=（）=>{
const[measure，setMeasure]=useState（[]）；
//加上这个
useffect（（）=>{
获取（“measures/shower/”+this.state.idShower）。然后（（res）=>{
setMeasure（res.data.measures）；
});
}, []);
//去掉这个
//componentDidMount（）{}
返回(
{measure.map（函数（数据、索引）{
返回(
{data.startTime}秒
);
})}
);
};
导出默认帮助屏幕；

const[measures]=useState（[]）
useffect（（）=>{
get（'measures'）。然后（res=>{
//this.setState（{measures:res.data.measures}）
this.state.measures=res.data.measures
this.state.measures.map（x=>{
console.log（一些）
})
});
});
返回(
你好，世界
{this.state.measures.map（（x）=>{x.WaterConsumption}}
)

componentDidMount

不存在于函数组件中-它不是类，没有方法。你已经将它的功能替换为了。是的，我试图更改为useEffect，但似乎不起作用。我得到了同样的错误。如果你复制粘贴语法错误，两者都不能修复语法错误！计算括号。这在第一部分似乎有效，但我没有得到{data.startTime}值。看起来它没有被返回。这可能是api响应问题

res.data.measures

检查响应中的数据，该数据应包含

startTime

，因为您正在渲染中使用它

useEffect(() => {
    const screen_focus = navigation.addListener('focus', () => {
      // CODE
    });

    // Return the function to unsubscribe from the event so it gets removed on unmount
    return screen_focus;
  }, [navigation]);

const HelpScreen = () => {
  const [measure, setMeasure] = useState([]);

  // add this
  useEffect(() => {
    api.get("measures/shower/" + this.state.idShower).then((res) => {
      setMeasure(res.data.measures);
    });
  }, []);

  // remove this
  //componentDidMount(){}

  return (
    <View style={styles.screen}>
      <Header></Header>
      <View>
        {measure.map(function (data, index) {
          return (
            <View>
              <Text>{data.startTime} seconds</Text>
            </View>
          );
        })}
      </View>
      <Dropdown />
    </View>
  );
};

export default HelpScreen;

const [measures] = useState([])


useEffect(() => {
    api.get('measures').then(res => {
        // this.setState({measures: res.data.measures})
        this.state.measures = res.data.measures
        this.state.measures.map(x => {
            console.log(some)
        })
    });
});

return(
    <View style={styles.screen}>
        <Text>Hello World</Text>
        <View>
            {this.state.measures.map((x) => <Text>{x.WaterConsumption}</Text>)}
        </View>
    </View> 
)