2016-11-03 14:33:02 pz789as 阅读数 12203
  • 完全征服React Native

    React Native是Facebook于2015年推出的跨平台开发工具,可用于开发Android和iOS App,并且同时具有混合开发的优点(热更新,跨平台)以及本地App的性能。 本课程采用新的ES6开发,主要内容包括ReactNative的基础知识,ReactNative的布局,组件,API,封装本地API和组件,发布ReactNative App,本地与ReactNative深度结合

    58314 人正在学习 去看看 李宁

参考:http://blog.csdn.net/pz789as/article/details/53021283


这个其实在RN的文档中已经写好了,不过最新的依然不需要做文档中的额外步骤。

直接在自定义的组件里面引用Linking,然后使用Linking的openURL函数即可,这个会自动选择系统的浏览器打开链接。

var url = 'http://www.baidu.com';
     Linking.openURL(url)
     .catch((err)=>{
       console.log('An error occurred', err);
     });

还可以使用canOpenURL做一次判断,是否是有效的地址,然后根据判断进行上面的操作:

Linking.canOpenURL(url)
    .then((supported)=>{
      if (!supported){
        console.log('Can\'t handle url: ' + url);
        Alert.alert(
          '提示', 
          'Can\'t handle url: ' + url,
          [
            {text: 'OK', onPress:()=>{}}
          ]
        );
      }else{
        return Linking.openURL(url);
      }
    })
    .catch((err)=>{
      console.log('An error occurred', err);
      Alert.alert(
        '提示', 
        'An error occurred: ' + err,
        [
          {text: 'OK', onPress:()=>{}}
        ]
      );
    });

后面发现文档中说了这么一句话:

你还可以使用其他类型的URL,比如一个地理位置(形如"geo:37.484847,-122.148386"或是一个通讯录名片,只要是可以通过{@code Intent.ACTION_VIEW}打开的即可。

也就是说这个Linking可以打开更多的东西,然后参考了IOS的openURL,试了下打开App Store,通讯录等等,结果是令人满意的,都可以打开。

因此,在你做的APP中,如果需要用户跳转到App Store中对你的应用进行评价的话,也可以这样做:

var url = 'itms-apps://';
    url = 'itms-apps://ax.itunes.apple.com/WebObjects/MZStore.woa/wa/viewContentsUserReviews?mt=8&onlyLatestVersion=true&pageNumber=0&sortOrdering=1&type=Purple+Software&id=APP_ID';
    //后面有个APP_ID,填写个人的APP_ID就可以跳转到评论地址了

    Linking.canOpenURL(url)

上面这个是在网上看到的,itms-apps:// 打头的就是指的APP Store,还有其他的可以参考这个地址。这里详细列出了各种常用系统应用的url头。


注意:如果按照这个方式无法打开,按照官方文档上说的要在项目的Info.list中设置LSApplicationQueriesSchemes字段

具体这个如何添加,网上也有资料,可以自行搜索下。


2017-09-11 11:37:31 s_521_h 阅读数 1851
  • 完全征服React Native

    React Native是Facebook于2015年推出的跨平台开发工具,可用于开发Android和iOS App,并且同时具有混合开发的优点(热更新,跨平台)以及本地App的性能。 本课程采用新的ES6开发,主要内容包括ReactNative的基础知识,ReactNative的布局,组件,API,封装本地API和组件,发布ReactNative App,本地与ReactNative深度结合

    58314 人正在学习 去看看 李宁

这个其实在RN的文档中已经写好了,不过最新的依然不需要做文档中的额外步骤。

直接在自定义的组件里面引用Linking,然后使用Linking的openURL函数即可,这个会自动选择系统的浏览器打开链接。

[javascript] view plain copy
print?
  1. var url = ‘http://www.baidu.com’;  
  2.      Linking.openURL(url)  
  3.      .catch((err)=>{  
  4.        console.log(’An error occurred’, err);  
  5.      });  
var url = 'http://www.baidu.com';
     Linking.openURL(url)
     .catch((err)=>{
       console.log('An error occurred', err);
     });

还可以使用canOpenURL做一次判断,是否是有效的地址,然后根据判断进行上面的操作:

[javascript] view plain copy
print?
  1. Linking.canOpenURL(url)  
  2.     .then((supported)=>{  
  3.       if (!supported){  
  4.         console.log(’Can\’t handle url: ’ + url);  
  5.         Alert.alert(  
  6.           ’提示’,   
  7.           ’Can\’t handle url: ’ + url,  
  8.           [  
  9.             {text: ’OK’, onPress:()=>{}}  
  10.           ]  
  11.         );  
  12.       }else{  
  13.         return Linking.openURL(url);  
  14.       }  
  15.     })  
  16.     .catch((err)=>{  
  17.       console.log(’An error occurred’, err);  
  18.       Alert.alert(  
  19.         ’提示’,   
  20.         ’An error occurred: ’ + err,  
  21.         [  
  22.           {text: ’OK’, onPress:()=>{}}  
  23.         ]  
  24.       );  
  25.     });  
Linking.canOpenURL(url)
    .then((supported)=>{
      if (!supported){
        console.log('Can\'t handle url: ' + url);
        Alert.alert(
          '提示', 
          'Can\'t handle url: ' + url,
          [
            {text: 'OK', onPress:()=>{}}
          ]
        );
      }else{
        return Linking.openURL(url);
      }
    })
    .catch((err)=>{
      console.log('An error occurred', err);
      Alert.alert(
        '提示', 
        'An error occurred: ' + err,
        [
          {text: 'OK', onPress:()=>{}}
        ]
      );
    });

后面发现文档中说了这么一句话:

你还可以使用其他类型的URL,比如一个地理位置(形如”geo:37.484847,-122.148386”或是一个通讯录名片,只要是可以通过{@code Intent.ACTION_VIEW}打开的即可。

也就是说这个Linking可以打开更多的东西,然后参考了IOS的openURL,试了下打开App Store,通讯录等等,结果是令人满意的,都可以打开。

因此,在你做的APP中,如果需要用户跳转到App Store中对你的应用进行评价的话,也可以这样做:

[javascript] view plain copy
print?
  1. var url = ‘itms-apps://’;  
  2.     url = ’itms-apps://ax.itunes.apple.com/WebObjects/MZStore.woa/wa/viewContentsUserReviews?mt=8&onlyLatestVersion=true&pageNumber=0&sortOrdering=1&type=Purple+Software&id=APP_ID’;  
  3.     //后面有个APP_ID,填写个人的APP_ID就可以跳转到评论地址了  
  4.   
  5.     Linking.canOpenURL(url)  
var url = 'itms-apps://';
    url = 'itms-apps://ax.itunes.apple.com/WebObjects/MZStore.woa/wa/viewContentsUserReviews?mt=8&onlyLatestVersion=true&pageNumber=0&sortOrdering=1&type=Purple+Software&id=APP_ID';
    //后面有个APP_ID,填写个人的APP_ID就可以跳转到评论地址了

    Linking.canOpenURL(url)

上面这个是在网上看到的,itms-apps:// 打头的就是指的APP Store,还有其他的可以参考这个地址。这里详细列出了各种常用系统应用的url头。


注意:如果按照这个方式无法打开,按照官方文档上说的要在项目的Info.list中设置LSApplicationQueriesSchemes字段

具体这个如何添加,网上也有资料,可以自行搜索下。


原文链接:
http://blog.csdn.net/pz789as/article/details/53021283

2018-06-21 11:30:34 potato512 阅读数 8836
  • 完全征服React Native

    React Native是Facebook于2015年推出的跨平台开发工具,可用于开发Android和iOS App,并且同时具有混合开发的优点(热更新,跨平台)以及本地App的性能。 本课程采用新的ES6开发,主要内容包括ReactNative的基础知识,ReactNative的布局,组件,API,封装本地API和组件,发布ReactNative App,本地与ReactNative深度结合

    58314 人正在学习 去看看 李宁

学习交流:https://gitee.com/potato512/Learn_ReactNative

react-native学习交流QQ群:806870562


通过 谷歌浏览器Chrome调试React Native程序
步骤一:先在模拟器上运行项目
步骤二:选中模拟器,同时使用键盘上的组合键"Command + D"打开Developer Menu菜单,并单击选择”Debug JS Remotely"

步骤三:在打开的谷歌浏览器里选择开发者工具:菜单——视图——开发者——开发者工具


步骤四:在模拟器里刷新项目"Command + R"则会看到调试效果


注意:要停止浏览器调试可以在模拟器上打开Developer Menu菜单,并单击选择”Stop Remotely JS Debugging"。


2018-04-14 17:24:28 suwu150 阅读数 910
  • 完全征服React Native

    React Native是Facebook于2015年推出的跨平台开发工具,可用于开发Android和iOS App,并且同时具有混合开发的优点(热更新,跨平台)以及本地App的性能。 本课程采用新的ES6开发,主要内容包括ReactNative的基础知识,ReactNative的布局,组件,API,封装本地API和组件,发布ReactNative App,本地与ReactNative深度结合

    58314 人正在学习 去看看 李宁
1. React-Native中的调试方法
指定查看安卓设备

在React-Native中输入以下命令,能够看到连接到电脑中的真实设备和虚拟设备

adb devices

设备结果如下图所示
devices

然后通过下面命令进行指定特定的设备进行运行和安装你要运行的app即可,命令行如下所示

react-native run-android --deviceId yourdeviceId

具体使用如下面:

react-native run-android --deviceId QLXBBBB641414921
指定ios设备

在真机测试的过程中,需要选中实体机进行操作,需要在Xcode工具中指定特定的机型进行按装操作,在最上方菜单选项中,选择要进行安装的机器,然后点击运行,即可以进行安装到指定装备上面

没有更多推荐了,返回首页