react-native 新建项目

指定版本新建项目

react-native init name // 系统默认版本
react-native init name --verison 0.44.0 // 指定版本0.44.0

第三库组件

React Native常用组件

@react-navigation 路由导航
@react-native-check-box(复选框)
@react-native-easy-toast (提示组件)
@react-native-splash-screen (启动屏幕)
@react-native-htmlView(Html渲染)
@react-native-web(pc浏览器调试)
@react-native-scrollable-tab-view(标签切换)
@react-native-sortable-listview(列表排序)
@react-native-tab-navigator(底部导航)
@react-native-parallax-scroll-view(视差滚动)

指定模拟器

react-native run-ios --simulator "iPhone 7”

构建失败

React Native初始化项目后执行react-native run-ios,构建失败

导航 react-native-elements组件

let RootNavigator = StackNavigator(
    {
        tab: {
            screen: tab, // 底部tab导航
            navigationOptions: ({ navigation }) => ({
                headerLeft: null
            })
        }
    },
    {
        navigationOptions: ({ navigation }) => ({
            headerStyle: {
              backgroundColor: "#ff9800"
            },
            alignSelf:'center',
            headerTitleStyle: {
                fontSize: 16,
                color: "#fff"
            }
        })
    }
)
package.json

{
  "name": "RN_test",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "antd-mobile-rn": "^2.2.1",
    "react": "16.0.0-alpha.6",
    "react-native": "0.44.0",
    "react-navigation": "^1.0.0-beta.9"
  },
  "devDependencies": {
    "babel-jest": "23.4.2",
    "babel-preset-react-native": "4.0.0",
    "jest": "23.4.2",
    "react-test-renderer": "~15.4.0-rc.4"
  },
  "jest": {
    "preset": "react-native"
  }
}

你可能感兴趣的:(react-native 新建项目)