Question

我试图解构风格对象，但它在行const { errorTextStyle } = myStyle;上给出了错误：Unexpected token (8:8)"。以下是整个代码：

import React, { Component } from 'react';
import { Platform, Dimensions, Text } from 'react-native';
import { Card, CardSection, Button, Input } from './common';

class LoginForm extends Component {
  /////////////////////
  state = {email: '', password: '', error: ''};
  const { errorTextStyle } = myStyle;
  /////////////////////    methods
  onButtonPress(){
    const { email, password } = this.state;
    firebase.auth().signInWithEmailAndPassword(email,password).
    catch(() => {
      firebase.auth().createUserWithEmailAndPassword(email,password).
      catch(() => {
        this.setState({error: 'Authentication Failed.'});
      });
    });
  }
  //////////////////////   render
  render(){
    return(
      <Card>

        <CardSection >
          <Input
            placeholder="Type here :)"
            onChangeText={ email => this.setState({ email }) }
            value={ this.state.email }
            label={ 'Email: ' }
            autoCorrect={false}
          />
        </CardSection >

        <CardSection >
          <Input
            placeholder="Type here :)"
            onChangeText={ password => this.setState({password}) }
            value={this.state.password}
            label={'Password: '}
            autoCorrect={false}
            secureTextEntry
          />
        </CardSection >
        <Text style={ errorTextStyle }>
          {this.state.error}
        </Text>
        <CardSection>
          <Button onPress={this.onButtonPress.bind(this)}>
            Login :)
          </Button>
        </CardSection>

      </Card>
    );
  }
}


const myStyle = {
  errorTextStyle: {
    fontSize: 20,
    alignSelf: 'center',
    color: 'red'
  }
};

export default LoginForm;

Answer 1

由于变量正在render中使用，因此请在该方法中移动该代码。您只能在class声明中声明方法和fields，表达式必须放在方法中。 state = ...正在为你工作，因为这是一个字段声明。请尝试以下方法：

render(){
  const { errorTextStyle } = myStyle;
  ...
}

无法破坏样式对象

1 个答案: