Реагировать на Native с Native Base (неожиданная ошибка токена)

У меня настроены React Native и Native Base. Когда я развертываю приложение для Android, оно выдает ошибку, в которой говорится, что рядом с тем местом, где в моем коде присутствует компонент Container, был обнаружен неожиданный токен.

Мой файл package.json:

{
  "name": "React Native POC",
  "version": "0.0.1",
  "private": true,
  "scripts": {
  "start": "node node_modules/react-native/local-cli/cli.js start",
  "test": "jest"
},
  "dependencies": {
  "native-base": "^0.5.18",
  "react": "15.4.1",
  "react-native": "0.39.2",
  "react-redux": "^4.4.6",
  "redux": "^3.6.0"
},
  "devDependencies": {
  "babel-jest": "17.0.2",
  "babel-preset-react-native": "1.9.0",
  "jest": "17.0.3",
  "react-test-renderer": "15.4.1"
},
  "jest": {
  "preset": "react-native"
}
}

Может ли быть так, что некоторые версии плохо работают с другими? Дополнительно (если это имеет значение) я использую Node версии 6.8.1, npm версии 3.10.8 и response-native-cli 2.0.0. Кроме того, у меня есть пряжа, синопия и browserify, установленные во всем мире.

Я все еще начинающий с React Native, и я не могу сказать, могут ли присутствовать конфликты зависимостей (очевидные или нет)

Мой файл JS:

import React, {Component} from 'react';
import {Container, Content} from 'native-base';

export default class ReactNativePOC extends Component {
  render() {
    return {
        <Container> // Error here
            <Content>
            </Content>
        </Container>
    }
  }
}

Кажется, нет никаких проблем с моей настройкой (за исключением собственной базы), так как я могу запустить реагирующее собственное приложение с элементами управления по умолчанию, однако, похоже, я получаю эту ошибку только для собственных базовых элементов управления

2 ответа

Решение

return оператор должен использовать скобки вместо фигурных скобок.

render() {
  return (
    <Container>
      <Content>
      </Content>
    </Container>
  );
}

Пожалуйста, проверьте основной синтаксис из документов React Native

Проверьте NativeBase KitchenSink - пример приложения со всеми компонентами пользовательского интерфейса NativeBase.

Поскольку вы сказали, что вы новичок в React Native, вы можете проверить Native Starter Kit - стартовый набор для React Native + NativeBase + Экспериментальная навигация + Redux + CodePush Apps.

Другие вопросы по тегам