Javascript 反应本机构造函数：意外标记，应为“；”

我是react native的新手，我面临一些关于语法错误的问题，我在这里给出了我的app.js

import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import MainService from './App/mainservice';

export default function App() {
  state ={
   loaded:false
  }
  constructor() {
   super();
   MainService.load(v =>this.setState({loaded:true}));
  }

  return (
    <View style={styles.container}>
      {this.state.loaded ? <Text>Open up App.js to start working on your app!</Text> : <Text> Loading..</Text>}
    </View>
  );
}

我做了一些研究，还没有找到任何解决方案，这是在每个解决方案中正确的方法，因此我有错误。你能帮我解决这个问题吗？为什么会发生这种情况？

不要尝试这个-尝试接受的答案

试试这个。有关说明，请参见代码注释

从“React”导入React； 从“react native”导入{样式表、文本、视图}； 从“./App/MainService”导入MainService； 导出默认功能应用程序{ constructorprops{//必须接受props参数 superprops；//必须将道具传递给super this.state={//如果定义构造函数，则应该在构造函数中定义所有初始状态 加载：false } MainService.loadv=>this.setState{loaded:true}； } 回来 {this.state.loaded？打开App.js开始使用你的应用！：loaded..} 不要尝试这个-尝试接受的答案

请尝试此操作。有关解释，请参阅代码注释

从“React”导入React； 从“react native”导入{样式表、文本、视图}； 从“./App/MainService”导入MainService； 导出默认功能应用程序{ constructorprops{//必须接受props参数 superprops；//必须将道具传递给super this.state={//如果定义构造函数，则应该在构造函数中定义所有初始状态 加载：false } MainService.loadv=>this.setState{loaded:true}； } 回来 {this.state.loaded？打开App.js开始使用你的应用！：loaded..}

---

React函数功能组件没有构造函数，也没有构造函数，它们是无实例的。您可以使用和挂钩提供组件生命周期函数的状态和感觉

import React, { useEffect, useState} from 'react';
import { StyleSheet, Text, View } from 'react-native';
import MainService from './App/mainservice';

export default function App() {
  const [loaded, setLoaded] = useState(false); // provide initial false state

  useEffect(() => {
    MainService.load(v => setLoaded(true));
  }, []); // empty dependency array analogous to componentDidMount

  return (
    <View style={styles.container}>
      {loaded ? (
        <Text>Open up App.js to start working on your app!</Text>
      ) : (
        <Text>Loading...</Text>}
      )
    </View>
  );
}

---

React函数功能组件没有构造函数，也没有构造函数，它们是无实例的。您可以使用和挂钩提供组件生命周期函数的状态和感觉

import React, { useEffect, useState} from 'react';
import { StyleSheet, Text, View } from 'react-native';
import MainService from './App/mainservice';

export default function App() {
  const [loaded, setLoaded] = useState(false); // provide initial false state

  useEffect(() => {
    MainService.load(v => setLoaded(true));
  }, []); // empty dependency array analogous to componentDidMount

  return (
    <View style={styles.container}>
      {loaded ? (
        <Text>Open up App.js to start working on your app!</Text>
      ) : (
        <Text>Loading...</Text>}
      )
    </View>
  );
}

---

哇，我需要更仔细地阅读，没有意识到这是一个功能组件，因为我是盲人，哇，我需要更仔细地阅读，没有意识到这是一个功能组件，因为我是盲人，

import React, { Component } from 'react';
import { StyleSheet, Text, View } from 'react-native';
import MainService from './App/mainservice';

export default class App extends Component {
  constructor() {
    super();
    this.state ={
      loaded:false
    }
  }

  componentDidMount() {
    MainService.load(v =>this.setState({loaded:true}));
  }

  render() {
    const { loaded } = this.state;
    return (
      <View style={styles.container}>
        {loaded ? (
          <Text>Open up App.js to start working on your app!</Text>
        ) : (
          <Text>Loading...</Text>}
        )
      </View>
    );
  }
}