如何运行react native github代码里的样例代码
发布网友
发布时间：2022-05-05 00:59
我来回答
共2个回答
懂视网
时间：2022-05-12 19:04
比如我们定义一个TouchableOpacity点击事件，该方法需要接收一个参数值，如下
_gotoSubClass(sectionID, rowID) {
console.log("sectionID="+sectionID + "rowID=" + rowID);
}那么在TouchableOption组件的onPress属性中应该这样写：
<TouchableOpacity onPress={() => this._gotoSubClass(sectionID, rowID)}>
<Text>{rowData.title}</Text>
</TouchableOpacity或者
<TouchableOpacity onPress={this._gotoSubClass.bind(this,sectionID, rowID)}>
<Text>{rowData.title}</Text>
</TouchableOpacity>
其中bind中的参数1：this代表的是上下文对象，后面跟的参数，对应私有方法中的参数顺序。
热心网友
时间：2022-05-12 16:12
本着什么都要搀和的原则，一起来看看React Native是如何开发iOS APP。
围观本文需自备Mac OSX ， XCode ， node 以及 npm 。
做好准备之后，打开你的终端（或其他命令行利器），键入下面命令：
npm install -g react-native-cli
和
react-native init AwesomeProject
此时，我们会看到一个名为AwesomeProject的文件夹，这就是工程文件的位置。使用XCode打开AwesomeProject.xcodeproj，并点击RUN，会看到iOS模拟器以及此项目对应的内容，效果如下：
如果想要修改显示内容，请打开index.ios.js，里面是一堆Javascript模样的东西。修改之后，在iOS模拟器中cmd+R就可以看到修改后的效果。
接下来，我们按照教程，来展示一张电影海报，为了方便，我们直接修改index.ios.js。
一、模拟数据
在var React = require('react-native');后面，我们先模拟一下海报所需要的数据：
var MOCKED_MOVIES_DATA = [
{title: 'Title', year: '2015', posters: {thumbnail: '}},
];
二、渲染
我们需要展示电影的标题、年份以及缩略图，因此我们需要下面这些东西（看起来也不难理解）：
var {
AppRegistry,
Image,
StyleSheet,
Text,
View,
} = React;
下面，为了展示我们需要的内容，我们来修改一下render部分的内容。
render: function() {
var movie = MOCKED_MOVIES_DATA[0];
return (
<View style={styles.container}>
<Text>{movie.title}</Text>
<Text>{movie.year}</Text>
<Image source={{uri: movie.posters.thumbnail}} />
</View>
)
}
最直观的感受，就像是我们在Javascript代码中写了HTML代码，<View>看起来类似于<div>。（此时在iOS模拟器中cmd+R可以看到不带样式的效果）
接下来，我们为渲染出来的数据添加样式：
var styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#F5FCFF',
},
thumbnail: {
width: 53,
height: 81,
},
});
我们可以使用flex来进行布局，看起来是个好消息。
在这时候，教程说，海报图片（<Image>）还没有添加样式，我们找到<Image source={{uri: movie.posters.thumbnail}} />，添加上style={styles.thumbnail}也就是变成下面的样子：
<Image
source={{uri: movie.posters.thumbnail}}
style={styles.thumbnail}
/>
此时在模拟器中cmd+R，可以看到效果如下：
如何运行react native github代码里的样例代码
做好准备之后，打开你的终端（或其他命令行利器），键入下面命令：npm install -g react-native-cli 和 react-native init AwesomeProject 此时，我们会看到一个名为AwesomeProject的文件夹，这就是工程文件的位置。使用XCode打开AwesomeProject.xcodeproj，并点击RUN，会看到iOS模拟器以及此项目对应的内容，效...
如何运行react native github代码里的样例代码
首先使用reactnative编写一个简单的应用，在碰到问题的时候，肯定需要对代码进行调试。目前reactnative支持在Chrome浏览器内进行调试。需要选择Scheme->Run的选项为Debug,否则模拟器中不会出现调试选项。将应用设置为在模拟器中运行，运行后
如何运行react native github代码里的样例代码
C++是程序语言，你得用编程的软件（比如VC++6.0）来编译c++源代码，然后运行c++程序。找到dsw文件（项目文件），双击，vc++6.0就打开了整个工程，所有的文件都包含在内了。你就可以编译链接，然后执行程序了。不知道你会不会VC++这个软件？vcl.h是 c++builder 里要用的 ...
如何编译ReactNative示例程序Examples
解决的办法有2个，一个是使用git工具(如smartGit)，将js代码恢复到之前的版本，另一个办法是重新编译reactNative的核心库，编译核心库需要ndk，在mac下没有问题，在windows编译会出错。编译reactNative核心库，对UIExplorer下注释掉的依赖项进行修改即可，编译速度较慢 需要在线下载第三方依赖库。dependencies...
React Native开源项目如何运行?
首先需要找到开源项目 ,比如下面这个.地址: https://github.com/Bob1993/react-native-gank 进入github, clone到本地或者直接download到本地。按照之前运行自己项目的经验，我们会直接在控制台进入项目目录，然后输入 react-native run-ios 或者react-native run-android 这时候发现并没有react-native 指令...
reactnative环境搭建?
1、首先安装了nodejs4.1版本2、然后安装了npminstall-greact-native-cli模块3、安隐哪装androidsdk并且配置android环境变量4、安装gradle环境5、进入这个博清羡客里边有react-nativeforandroid项目,下载下来,然后执行灶正码npminst...ReactNative搭建环境及librarynotfoundfor-lstdc++.6.0.9问题解决方案 一.搭建RN环境:...
React Native开发android和ios客户端有什么优势和劣势
下面，我们可以尝试用React Native创建一个 iOS APP.在我们开始之前，我建议：你可以在 Github里先下载 React Native 的代码框架。里面还有一些示例项目，2048 的游戏， Movies（一个看电影的 APP）,SampleApp, TicTacToe (一款游戏)和 UIExplorer（能显示出所有用 React Native 替代的控件，如ListView，...
[ReactNative] Buffer 使用base64
Base64编解码算法在Nodejs的buffer组件中有支持，首先我们需要在项目根目录下运行命令行安装buffer依赖：npm install buffer --save 使用方法:引入 var Buffer = require（'buffer'）.Buffer 编码 var base64Str = new Buffer(rawStr).toString('base64');解码 var b = new Buffer(base64...
React Native 轻松集成聊天组件
drawable 文件夹下。 点九图介绍 ，sample 项目下的 drawable-xhdpi 文件夹中有示范 padding 对象包括四个属性: left, top, right, bottom. eg: {left: 5, top: 5, right: 15, bottom: 5} [使用案例参考]( https://github.com/jpush/aurora-imui/tree/master/ReactNative/sample ...
React-Native-IOS使用高德地图
在ios上，可以按照说明文档进行配置，也就是手动链接。我是先执行 react-native link react-native-smart-amap 进行自动链接，然后再按照说明文件进行配置，需要注意的地方有两点：这时的运行结果如下图所示，地图上并没有标注出坐标的位置，查了issuse列表看到别也提了这个问题，估计是依赖的问题，我就查...
