React中上传图片到qiniu(2017-05-10更新)
之前有写过类似的一篇文章,有位同学突然找来解惑,发现自己采用了另外的一个方法,这里也分享下,希望对使用reactjs的同学有帮助。
逻辑思路是这样子的,在componentDidMount中实现更新dom的操作,异步加载需要的资源文件,然后在加载完后实现qiniu的初始化操作。这里就不需要在webpack或者其他打包工具中去引入qiniu的包文件,导致打完包的文件过大了。
我这里使用了nodejs的库
...之前有写过类似的一篇文章,有位同学突然找来解惑,发现自己采用了另外的一个方法,这里也分享下,希望对使用reactjs的同学有帮助。
逻辑思路是这样子的,在componentDidMount中实现更新dom的操作,异步加载需要的资源文件,然后在加载完后实现qiniu的初始化操作。这里就不需要在webpack或者其他打包工具中去引入qiniu的包文件,导致打完包的文件过大了。
我这里使用了nodejs的库
...结合上几篇博文,今天学习下,如果来优化一下我们的状态指示器。
前面几篇文章,在renderLoadingView方法中,直接使用了一个View,然后加了一个简单的字符串进行提示,看起来还是简陋的很。
修改之后,这个方法的代码如下:
renderLoadingView:function(){ return ( <LoadingView /> ); },
这个LoadingView方法
...React-Native最近看了下他的ListView组件,记录下自己实现的小小功能:
一个简单的列表都没啥特别的了,这里添加一个导航。
首先使用NavigatorIOS组件,给我们的首页添加一个导航
var WalkerfreeProject = React.createClass({ render:function(){ return ( <NavigatorIOS...
在React中使用qiniu上传图片,实现方式有很多种,一种是在web端实现上传,一种是在server端实现上传
这里我说下我是如何在web端实现上传图片到七牛的
七牛的官方已经有了javascript的使用说明我这里就不重复了。
使用React首先是要把qiniu提供的js引入,由于我这里是使用的webpack,所以我就直接放在了引入文件中,
这样我就可以全局引用了。
require('./qiniu.j...
使用react的时候,总有一些变量是html的字符串,但是我们却想要实现innerHtml的类似方法,直接用html进行渲染。
这里react提供了一个dangerouslySetInnerHTML方法,可以实现此赋值操作。具体详情可以自己去google一个下,关键字:'react dangerouslySetInnerHTML'.
下面是我为记录的一个示例,可以作为一个简单的demo了。
const...
使用插件google的prettify和jquery的format 完成了一套很完美的代码高亮显示,还能自动格式化。
先说jquery.format的接入【我这里开发是用的webpack】
在引入文件中使用reqiure方法,把jquery.format加入到js代码中。
require('./jquery.format.js');
jquery.format.js 这个文件我放在了与引入文件同级的目录下
...本文主要是引入官方的使用,如果此时间较晚,可到官方查看较新使用说明:
React.PropTypes
提供很多验证器 (validator) 来验证传入数据的有效性。当向 props 传入无效数据时,JavaScript 控制台会抛出警告。注意为了性能考虑,只在开发环境验证 propTypes
。下面用例子来说明不同验证器的区别:
React.createClass({ propTypes: {...
很奇怪的,这个是要去自己发现的,我也是在摸索中发现的,其实React的使用,只有你发现了,才觉得好玩,最近的Reflux就是这样子的。
##表单提交部分
handleSubmit:function(e){ e.preventDefault(); var params = {}; var keys = React.findDOMNode(this.refs.keys).value.trim(...
React的分页实例来了![适合与webpack组合使用,不太适合纯html页面调用,不过可以根据您自己的情况进行改写]
define(function(require,exports,module){ 'use strict'; var React = require('reactAddons'); module.exports = React.createC...