关于reactjs:FAB在React Native中不起作用

FAB not working in React Native

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
import React, { Component } from 'react';
import { Container, Header, View, Button, Icon, Fab } from 'native-base';
export default class FABExample extends Component {
  constructor() {
    this.state = {
      active: 'true'
    };
  }
  render() {
    return (  
      <Container>
        <Header />
        <View style={{ flex: 1 }}>
          <Fab
            active={this.state.active}
            direction="up"
            containerStyle={{ }}
            style={{ backgroundColor: '#5067FF' }}
            position="bottomRight"
            onPress={() => this.setState({ active: !this.state.active })}>
            <Icon name="share" />
            <Button style={{ backgroundColor: '#34A34F' }}>
              <Icon name="logo-whatsapp" />
            </Button>
            <Button style={{ backgroundColor: '#3B5998' }}>
              <Icon name="logo-facebook" />
            </Button>
            <Button disabled style={{ backgroundColor: '#DD5144' }}>
              <Icon name="mail" />
            </Button>
          </Fab>
        </View>
      </Container>
    );
  }
}

我正在使用上面的代码,以便在我的项目中添加FAB。 但是我遇到一个错误:

Body:{"type":"TransformError","snippet":" 3| constructor() {
4| this.state ......


这似乎是NativeBase提供的示例代码中的错误。 为了纠正错误,请添加super();。 在您的构造函数中,如下所示。

1
2
3
4
5
6
constructor() {
  super();
  this.state = {
    active: 'true'
  };
}

您可以参考此链接以了解更多详细信息,以了解为何构造函数需要在访问"此"之前调用超级方法