研究几天RN（React-Native）后，跟着官方的demo做了一下电影图片显示的那个，但是总感觉官方的demo欠缺点什么，所以找来找去找到了RN版的知乎日报，话说知乎日报什么版的都有，不信你们上网搜搜。下面是知乎日报的链接：https://github.com/race604/ZhiHuDaily-React-Native话说我是个git盲，所以我是DOWNLOAD zip下载的，这也导致出现了后边的一些小问题，下载之后解压，然后直接复制到了搭建RN开发环境中的Reactnative目录，具体...
state state顾名思义就是状态，它只是用来控制这个组件本身自己的状态，我们可以用state来完成对行为的控制、数据的更新、界面的渲染，由于组件不能修改传入的props，所以需要记录自身的数据变化。 那么，我们要如何修改state中的值呢？setState 时react用来修改state状态中的值的方法如何使用this.setState({ key:value}) 这样就行了。props react中说的单向数据流值说的就是props，根据这一特点它还有一个作用：组件之间的通...
React 可以灵活的应用在各种各样的项目中。你可以用它来创建新的应用程序，你也可以逐步引用而不改变现有的代码库。React 起源于 Facebook 的内部项目，因为该公司对市场上所有 JavaScript MVC 框架，都不满意，就决定自己写一套，用来架设 Instagram 的网站。做出来以后，发现这套东西很好用，就在2013年5月开源了。 你可以直接访问 官方文档，从怎么安装React开始学习，也可以看看 React 入门实例教程 这篇文章，笔者就是通过这...
1、PubSub使用方式1.1 react导入库npm install pubsub-js --save1.2 react 页面引入pubsubjsimport PubSub from ‘pubsub-js‘1.3 pubsubjs使用发送消息：PubSub.publish(名称,参数)订阅消息：PubSub.subscrib(名称,函数)取消订阅：PubSub.unsubscrib(名称) PS:pubsubjs源码及使用详情https://github.com/mroderick/PubSubJS 2、React实例使用监听实现传参 2.1 子页面home.js使用PubSub.publish发送state[javascript] view plainco...
相信大家在学习和使用react的过程中，稍不注意就会出现this指向错误的问题，这个问题虽然比较好解决，但是还是让人比较头疼，那么下面就说一下解决这个问题的四种写法。一.行间定义事件后面使用bind绑定thisrun(){ alert("第一种方法！") }<button onClick={this.run.bind(this)}>第一种</button> 这一种方法使用bind来修改this的指向，需要注意的是bind括号内第一个参数是修改this的，后面可以设置其他参数进行传值。二.在构造函数...
一、什么是虚拟DOM虚拟DOM可以看做一棵模拟了DOM树的JavaScript对象树。比如： 1 var element = {2 element: ‘ul‘,3 props: {4 id:"ulist"5 },6 children: [7 { element: ‘li‘, props: { id:"first" }, children: [‘这是第一个List元素‘] },8 { element: ‘li‘, props: { id:"second" }, children: [‘这是第二个List元素‘] }9 ] 10 }二、为什么使用虚拟DOM在传统的 Web 应用中，我们...
电脑环境：需要先安装好 1. nodejs （官网下载安装，安装8.0以上版本， 使用 node --version 查看是否安装成功）2. npm （安装好node时跟着就安装好了npm，使用 npm -v 查看是否安装成功）3. typescript （打开终端命令，输入 npm install -g typescript ，输入 tsc -v 查看是否安装成功） vscode 中搭建 react + typeScript 开发环境1. 新建一个空文件夹，比如命名为 react_add_ts 2. 在vscode中打开这个文件夹，注意这时候...
前言：由于苹果发布的ios的一些rn的app存在安全问题，主要就是由于一些第三方的热更新库导致的，然而消息一出就闹得沸沸扬扬的，导致有些人直接认为“学了大半年的rn白学啦～～！！真是哭笑不得。废话不多说了，马上进入我们今天的主题吧。“因为一直在做android开发，所以今天也只是针对于android进行热更新尝试（ios我也无能为力哈，看都看不懂，哈哈～～～）。先看一下效果：怎么样？效果还是不错的吧？其实呢，实现起来还是不是...
一、React的世界观1、通过改变state来改变视图视图不用考虑如何改变自己，把state画出来即可。2、变量不可变通过创建一个新的state来更改state，使得变更可追踪，不容易因为其他部分修改state导致不可预测的错误3、结构与样式分离参考了CSS的做法，RN的style机制使得代码更清晰更易维护4、采用消息替代调用组件直接不直接调用，使得组件间松耦合，便于维护和团队开发二、为什么使用React Native？1、热更新开始只是为了能够热更新，...
首先，React.js是facebook在2013年5月开源的一个前端框架，React不是一个MVC框架，它是构建易于可重复调用的web组件，侧重于UI, 也就是view层， React为了更高超的性能而使用虚拟DOM作为其不同的实现。 它同时也可以由服务端Node.js渲染 － 而不需要过重的浏览器DOM支持， React实现了单向响应的数据流，从而减少了重复代码，这也是它为什么比传统数据绑定更简单。因其新颖独特， 目前在国内还没有很多的应用。但是其性能出众，代码...
componentWillMount(){ BackHandler.addEventListener(‘hardwareBackPress‘, this.onBackAndroid); } componentWillUnmount() { BackHandler.removeEventListener(‘hardwareBackPress‘, this.onBackAndroid); } componentDidMount() { console.log("当前路由"); console.log(this.props.navigation.state); } onBackAndroid = () => {//这里的路由信息是你自己项目中的，通过这个原理，我们还是可以提示一...
谈移动应用的跨平台开发不能不提HTML5，PhoneGap和Sencha等平台一直致力于使用HTML5技术来开发跨平台的移动应用，现在看来这个方向基本算是失败的，基于HTML5的移动应用在用户体验上与原生应用仍然存在着明显的差距。与上述HTML5平台不同，Xamarin和React Native通过各自的方式来实现跨平台。Xamarin基于Mono框架将C#代码编译为原生平台代码，React Native则是在UI主线程之外运行一个JavaScript线程，两者呈现给用户的都是原生体验...
前言React-Native从诞生至今，火热程度已经不言而喻，在不断的框架迭代过程中，RN也提供了丰富的组件，以供开发者使用，但是在实际应用中，我们可能需要更为丰富的交互组件，但是RN中又没有及时提供，这时候我们就需要使用RN的本地模块，本地模块即可以使用JS调用Native，也可以使用Native调用JS, 并传递各种参数，实现完整功能，接下来我们看看具体的使用方法，方便大家参考学习，如果想了解更多，我们可以查阅官方的文档。下面文...
react入门之搭配环境（一）如果你想直接上手开发，而跳过这些搭配环境的繁琐过程，推荐你使用官方的create-react-app命令 npm install -g create-react-app //安装create-react-app脚手架 npm为node.js的包管理工具，请确保你已经安装了node.js create-react-app my-app //使用create-react-app创建，my-app为项目名称 cd my-app/ //进入my-app目录 npm start //运行项目 现在打开 http://localhost:3000/ 就能看...
netty最核心的就是reactor线程，对应项目中使用广泛的NioEventLoop，那么NioEventLoop里面到底在干些什么事？netty是如何保证事件循环的高效轮询和任务的及时执行？又是如何来优雅地fix掉jdk的nio bug？带着这些疑问，本篇文章将庖丁解牛，带你逐步了解netty reactor线程的真相[源码基于4.1.6.Final]reactor 线程的启动NioEventLoop的run方法是reactor线程的主体，在第一次添加任务的时候被启动NioEventLoop 父类 SingleThreadEven...