React-native 踩的坑

RN笔记-Navigator和TabNavigator

替换新的导航

安装教程
安装完之后报错:、

unable to resolve module 'react-navigation' from ......
This might be related to https://github.com/facebook/react-native/issues/4968
To resolve try the following:

1、Clear watchman watches: watchman watch-del-all.
2、Delete the node_modules folder: rm -rf node_modules && npm install.
3、Reset packager cache: rm -fr $TMPDIR/react-* or npm start --reset-cache

React-native 踩的坑_第1张图片

原因不详,解决如下:
首页移除node_modules命令如下:

rm -rf node_modules

然后重新加载只能使用npm,不要使用cnpm和yarn

npm install

之后报错找不到入口文件
React-native 踩的坑_第2张图片

查看端口命令:

win:lsof -n -i4TCP:8081
mac:lsof -i:8081

杀死端口命令:

通过键入shell来杀死它  kill -9 。使用与上一个答案中提供的相同的PID。

然后跑npm start。

kill 8081

React Navigation的使用心得

首先导入
import { StackNavigator } from 'react-navigation';
//组件类
class HomeScreen extends React.Component {
  static navigationOptions = {
    title: 'Welcome',
  };
  render() {
    return Hello, Navigation!;
  }
}
//然后把组件类加入到导航组件中
const SimpleApp = StackNavigator({
  Home: { screen: HomeScreen },
});

//重要 如果要使用导航,必须把导航添加为组件入口
// export default AppNav;
module.exports = AppNav;
//或者注册应用入口
//AppRegistry.registerComponent('SimpleApp', () => SimpleApp);

React Navigation官网文档

开发高德地图使用js,必须配置plist文件如下:

React-native 踩的坑_第3张图片

1、iOS9为了增强数据访问安全,将所有的http请求都改为了https,为了能够在iOS9中正常使用地图SDK,请在”Info.plist”中进行如下配置,否则影响SDK的使用。

<key>NSAppTransportSecuritykey>
<dict>
    <key>NSAllowsArbitraryLoadskey>
    <true/>
dict>

2、在iOS9中为了能正常调起高德地图App的功能,必须在”Info.plist”中将高德地图App的URL scheme列为白名单,否则无法调起,配置如下:

<key>LSApplicationQueriesSchemeskey>
<array>
    <string>iosamapstring>
array>

3、开启定位

需在info.plist中添加
NSLocationWhenInUseUsageDescription或NSLocationAlwaysUsageDescription字段

NSLocationWhenInUseUsageDescription
表示应用在前台的时候可以搜到更新的位置信息。
NSLocationAlwaysUsageDescription
表示应用在前台和后台(suspend或terminated)都可以获取到更新的位置数据。

react-native-amap插件的使用(iOS)

React Native开源高德地图定位组件(react-native-amap-location)

你可能感兴趣的:(react)