React Native 从类组件到函数组件

在React Native中，类组件和函数组件是两种不同的组件写法。函数组件是React Hooks出现后的一种新写法，它们更简洁，可以包含逻辑，但不能使用state和其他类组件的特性。

以下是一个简单的类组件和函数组件的对比示例：

类组件（Class-Based Component）:

import React from 'react';
import { Text, View } from 'react-native';
 
class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = { count: 0 };
  }
 
  render() {
    return (
      <View>
        <Text>{this.state.count}</Text>
      </View>
    );
  }
}
 
export default MyComponent;

函数组件（Functional Component with Hooks）:

import React, { useState } from 'react';
import { Text, View } from 'react-native';
 
const MyFunctionComponent = () => {
  const [count, setCount] = useState(0);
  return (
    <View>
      <Text>{count}</Text>
    </View>
  );
};
 
export default MyFunctionComponent;

在这个例子中，MyComponent是一个类组件，它使用了state来跟踪count的值。MyFunctionComponent是一个函数组件，它使用了Hook（useState）来跟踪count的值。函数组件是React Hooks引入后的一种更现代、更推荐的写法。