javascript - JavaScript/React 中的构造函数是必需的吗？

Question

此代码需要一个构造函数。我不明白需要一个构造函数来使用“this”(Eu não estou entendendo a necessidade de ter um construtor para usar o 'this')

import React, {Component} from 'react';
import {StyleSheet, TouchableOpacity, Text, View} from 'react-native';


class Botao extends Component{

this.styles = StyleSheet.create({}); // requiring a constructor

render(){
    return(
        <TouchableOpacity>
            <View>
                <Text>Clique</Text>
            </View>
        </TouchableOpacity>
    );
}
  }

我可以在不使用它的情况下这样做吗？

class Botao extends Component{

render(){
    return(
       <TouchableOpacity>
            <View>
                <Text style={this.styles.texto}>Clique</Text>
            </View>
       </TouchableOpacity>
    );
}

styles = StyleSheet.create({
    texto:{
        fontSize: 60
    }
}); 

}

Answer 1

你实际上有两个选择......

1)使用类构造函数:

class Botao extends Component{

  constructor(){
   this.styles = StyleSheet.create({}); // requiring a constructor
  }

  render(){
    return(
        <TouchableOpacity>
            <View>
                <Text>Clique</Text>
            </View>
        </TouchableOpacity>
    );
  }
}

2) 直接将其声明为类属性(不带 this):

class Botao extends Component{

  styles = StyleSheet.create({});

  render(){
    return(
        <TouchableOpacity>
            <View>
                <Text>Clique</Text>
            </View>
        </TouchableOpacity>
    );
  }
}

在这两种情况下，您都可以使用 this.styles 从类中的其他位置访问 styles

如果您正在编写 React 组件，通常不需要使用构造函数方法。正如 the docs 中所述:

If you don’t initialize state and you don’t bind methods, you don’t need to implement a constructor for your React component.