javascript - 相邻元素与 native react 时出错

Question

我对 react-native 非常陌生，并且在使用此代码时遇到问题:

  import React, { Component, PropTypes, View } from 'react'
import { connect } from 'react-redux'
import StartupActions from '../Redux/StartupRedux'
import ReduxPersist from '../Config/ReduxPersist'

import { StackNavigator } from 'react-navigation'

import WelcomeContainer from '../Containers/WelcomeContainer'
import SettingsContainer from '../Containers/SettingsContainer'
import About from '../Components/About'
import { Header } from 'react-native-elements'



const AppNavigator = StackNavigator({
  Home: {
    screen: WelcomeContainer,
    navigationOptions: {
      title: 'Multi Language Sample App' // we advice using something static like your app's name or company name on the startup screen
    }
  },
  Settings: {
  screen: SettingsContainer,
  navigationOptions: ({navigation}) => ({
    title: navigation.state.params.title
  })
},
  About: {
  screen: About,
  navigationOptions: ({navigation}) => ({
    title: navigation.state.params.title
  })
}
})

class RootContainer extends Component {
  componentDidMount() {
    if (!ReduxPersist.active) {
      this.props.startup()
    }
  }

  render() {
    return (
      <View>
      <AppNavigator />
      <AppNavigator />
      </View>
    )
  }
}

const mapStateToDispatch = dispatch => ({
  startup: () => dispatch(StartupActions.startup())
})


export default connect(null, mapStateToDispatch)(RootContainer)

RootContainer.propTypes = {
  startup: PropTypes.func.isRequired
}

我收到错误:相邻的 JSX 元素必须包含在封闭标记中。

我发现不同的帖子都有相同的问题，但无法解决我的问题。

Answer 1

将代码包含在 View 或另一个父元素内。

render() {
    return (
       <View>
            <AppNavigator />
            <Button
                 large
                 icon={{name: 'envira', type: 'font-awesome'}}
                 title='LARGE WITH RIGHT ICON' />
      </View>
      )
  }
}