Rectjs工作中遇到问题总结:
1. reactjs router传复杂值
传值:用这个方法的话不会将参数带到url后
browserHistory.push({ pathname: '/detail',state: {item: JSON.stringify(item)}});
用这个方法会将item的数据带到url后面
browserHistory.push({ pathname: '/detail',
query: {item: JSON.stringify(item)}});
reactjs 传值各种方法:
http://www.tuicool.com/articles/zAVrqyQ
2. 浏览器跨域解决用:
open -a "Google Chrome" --args --disable-web-security
3. 分页显示对应的item:
var self = this;
data && data.forEach((item, i)=>{
if(i == page*self.pageSize-self.pageSize ||
(i > page*self.pageSize-self.pageSize && i < page*self.pageSize)){
rows.push(<div>item</div>);
}
4. js基础知识思维导图:
http://www.jb51.net/article/42991.htm
5. 跨域:
http://www.cnblogs.com/dojo-lzz/p/4265637.html
http://blog.csdn.net/lambert310/article/details/51683775
6. 用路由emit广播传值:MenuList(要接受广播的文件里面)
接受广播文件中开始引入:
const reactMixin = require('react-mixin')
const EventEmitterMixin = require('react-event-emitter-mixin')
constructor中加入
this._bindEvts = this._bindEvts.bind(this)
并
_bindEvts () {
this.eventEmitter('on', 'test', () => {
console.log("_bindEvts");
this.getAllNum();
})}
文件最后加入:
reactMixin(MenuList.prototype, EventEmitterMixin)
在发送广播里面:
const reactMixin = require('react-mixin')
const EventEmitterMixin = require('react-event-emitter-mixin')
并在需要发送广播的地方加入:
self.eventEmitter('emit', 'test');
7. 用路由router传值
import { browserHistory, Link } from 'react-router';
browserHistory.push({ pathname: '/test',
state: {item: JSON.stringify(data)}});
接受端:
constructor(props) {
this.locationData = this.props.location.state&&JSON.parse(this.props.location.state.item);
this.state={data: this.locationData?this.locationData:""}
8. git pull报错:
There is no tracking information for the current branch.
Please specify which branch you want to merge with.
See git-pull(1) for details.
git pull <remote> <branch>
If you wish to set tracking information for this branch you can do so with:
git branch --set-upstream-to=origin/<branch> develop
解决方法:
git push --set-upstream origin develop
9. Promise demo:
let queue = []
queue.push(() => {
return new Promise((resolve, reject) => {
fetchdata('http://127.0.0.1',{}).then(({result}) => {
console.log(result)
if(result.success){
resolve(result)
}
else{
reject(new Error("failed"))
}
});
})
})
queue.push(() => {
return new Promise((resolve, reject) => {
fetchdata('http://127.0.0.1',{}).then(({result}) => {
console.log(result)
if(result.success){
resolve(jsonResult)
}
else{
reject(new Error("failed"))
}
});
})
})
Promise.each(queue, (queueItem) => {
return queueItem()
})
10. 单点登录:
http://www.jianshu.com/p/613e44d4a464
11. 多个文件上传:
https://www.npmjs.com/package/react-upload-file#examples
实例:
http://blog.csdn.net/a245452530/article/details/52983216
12. input 文件accept过滤:
http://1985wanggang.blog.163.com/blog/static/776383320138611613203/
13. react router
http://blog.csdn.net/u013063153/article/details/52504184
14. react-router 实例: demo 导航加+右边切换
http://www.qdfuns.com/notes/15571/9a712df7d6775e0c881232a77cedb0a5.html
15. table td 设置宽度无效,td里面添加div
16. checkbox 及raidobutton的状态更改,需要用一个数组statuslist纪录对应位置checked是true/false,每次
<checkbox checked={this.statuslist[i]}></checkbox>
17. 多选框样式:
http://www.helloweba.com/view-blog-295.html
18. 粘贴板功能:
https://github.com/nkbt/react-copy-to-clipboard
19. cookie设置删除查询:
http://www.jb51.net/article/64330.htm
20. git 设置:
http://www.cnblogs.com/mengdd/p/3447464.html
21. 判断对象是否为空:
isEmptyObject(obj) {
for (var key in obj) {
return false;
}
return true;
}
22. checkbox和多选:
用一个数组isCheckedList记录选中状态,如果本身选中将对应的值修改为false,其他本身值
用另一个数组isItemShowList记录隐藏状态,如果自己点击选中,同时修改isCheckedList数组的值
isAllChecked: false,//全选是否被选中
isCheckedList: [],//记录listview中每一个item是否被选中的状态数组,true是选中
isItemShowList: [],//记录每条item是否隐藏的数组,true是显示
isAllShow: false,//记录所有item是否隐藏和显示具体信息,true是显示
isDisabled: true, //记录整体隐藏和操作按钮是否可点击,初始不可点击为true,有选中元素时才可点击变为false
23. 下载sublime:
http://www.waitsun.com/sublime-text-3-3075.html
24. 设置淘宝镜像:
http://www.jianshu.com/p/3baed1d862ce
npm install -g cnpm --registry=https://registry.npm.taobao.org