2018年07月____Alive___

原创 React-Native之Xcode虚拟机快捷键刷新和弹出菜单不能用

1：描述有时候运行在Xcode虚拟机上的react-native项目 command+T和command+D没有效果2：原因其实这个问题主要是由于iOS Simulator和键盘之间断开了连接导致的，也就是说iOS Simulator不在接受键盘的事件了3：解决方式打开Xcode虚拟机开启连接 ...

2018-07-26 20:05:08 1161

原创 React-Native之Xcode虚拟机的动画很慢

1：原因可能是无意间开启了Xcode虚拟机的动画，关闭就ok了，可以打开Xcode虚拟机，然后使用快捷键关闭command+T2：解决方式：打开Xcode虚拟机关闭动画...

2018-07-26 19:55:52 2229

原创 React-Native之react-native-simple-toast的SHORT错误

1：错误截图 2：解决方式react-native unlink react-native-simple-toast react-native link react-native-simple-toast react-native run-ios

2018-07-26 19:42:15 800

原创 React-Native之Xcode路径错误

1：具体错误2：原因：没有设置Xcode的路径 3：解决方式：在命令行中输入sudo xcode-select -switch /Applications/Xcode.app 注意：-switch后面是自己的Xcode路径...

2018-07-26 17:12:42 419

原创 React-Native之webStorm调用Xcode

1：第一次用webstorm调用Xcode或许会报如下的错误原因：没有设置路径2：解决方式:设置路径终端执行sudo xcode-select -switch （后面的路径是自己的Xcode路径）/Applications/Xcode.app/Contents/Developer命令，然后再输入一次系统的密码，完成。 ...

2018-07-25 17:59:45 366

原创 React-Native之YGNodeList.c normal x86_64错误

1：错误截图2：解决方式2.1：删除ModuleCache文件尝试运行一下，react-native run-ios，如若不行，先执行2.1后执行2.22.2:尝试清理build用Xcode打开项目，点击 Clean Build Folder,然后重新用webStorm运行项目...

2018-07-24 09:32:22 684

原创 React-Native之CFBundleIdentifier错误

1：错误如图2：解决方式删除ios目录下的build目录，然后react-native run-ios

2018-07-24 08:54:26 890 1

原创 JS之对象、原型、原型链

一：对象的声明方式1、字面式声明对象如下:var ohj={属性名称:属性值,方法名称:function(){//函数执行体}} 2、new 操作符+Object 声明对象如下:var obj=new Object();obj.属性名称=属性值;obj.方法名称=function(){//函数执行体}3、构造函数声明对象...

2018-07-18 11:54:20 222

原创 JS之闭包

1：闭包用途用途1：读取函数内部变量用途2：让函数内部变量在内存中保留2：如何使用在函数a中嵌套b函数，a函数需要返回b函数function a() { var i=1; function b() { alert(i); } return b;}var c=a();//此时a函数返回b函数即var c=b;c();//1...

2018-07-18 11:07:23 162

转载 session,cookie,sessionStorage,localStorage的区别及应用场景

浏览器的缓存机制提供了可以将用户数据存储在客户端上的方式，可以利用cookie,session等跟服务端进行数据交互。一、cookie和sessioncookie和session都是用来跟踪浏览器用户身份的会话方式。区别：1、保持状态：cookie保存在浏览器端，session保存在服务器端2、使用方式：（1）cookie机制：如果不在浏览器中设置过期时间，cookie被保...

2018-07-17 09:23:38 627

原创 Redux之使用redux-thunk进行ajax请求发送

1：中间件流程图 2：Redux-thunk作用：简单说：当组件中有复杂的异步请求时，为了减少组件的复杂程度把异步请求使用此中间件放在actionCreator.js中3：使用之前使用之前是在组件内进行数据请求store/index.js//store.jsimport {createStore,applyMiddleware} from 'redu...

2018-07-16 20:03:36 3792

原创 Redux之redux-actions的使用

1：作用：当我们的在开发大型应用的时候，对于大量的action，我们的reducer需要些大量的swich来对action.type进行判断。 redux-actions可以简化这一烦琐的过程，它可以是actionCreator，也可以用来生成reducer，其作用都是用来简化action、reducer。主要函数有createAction、createAct...

2018-07-16 17:15:44 6575

原创 React之带标签的字符串转义为html解析

在使用reactjs库的时候，会遇到将一段html的字符串，然后要将它插入页面中以html的形式展现，如果直接插入的话页面显示的就是这段字符串，而不会进行转义使用此属性可以转义并显示内容注意：定义在组件属性上<Content dangerouslySetInnerHTML={{ __html: this.props.content}}/>...

2018-07-15 10:16:20 1939

1:一些区别react-router React Router 核心react-router-dom 用于 DOM 绑定的 React Routerreact-router-native 用于 React Native 的 React Routerreact-router-redux React Router 和 Redux 的集成react-router-config 静态路由配置的小助手2：地...

2018-07-13 16:48:28 1186

翻译 React之axios的基本用法

1：简单介绍Axios 是一个基于 promise 的 HTTP 库，可以用在浏览器和 node.js 中。2：地址https://www.kancloud.cn/yunye/axios/2348453：get请求// 为给定 ID 的 user 创建请求axios.get('/user?ID=12345') .then(function (response) { console.l...

2018-07-13 11:33:55 8624

原创 React之用react-transition-group的CSSTransition完成搜索框的过度效果

官方地址：https://reactcommunity.org/react-transition-group/一：没有使用Transition1：效果2：主要代码：（使用了styled-components参考点击打开链接） 2.1:style.js import styled from 'styled-components';export const SearchWrap...

2018-07-11 16:58:45 2346 1

原创 React之styled-components

1：styled-components作用解决 CSS 全局作用域的问题，使各个组件之间的样式互不影响2：安装npm install --save styled-components3：在css文件里引入import {injectGlobal} from 'styled-components';注意：此时css文件可以改成js文件...

2018-07-11 12:55:20 1142

原创 CSS之CSS Tools: Reset CSS

地址：https://meyerweb.com/eric/tools/css/reset/目的：重置样式表的目标是减少不同浏览器在默认行高，边距和标题字体大小等方面的不一致性。使用：html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, ...

2018-07-11 11:54:22 593

原创 Redux之react-redux简单项目入门

一：效果图二：目录结构注意：已经安装了react官方脚手架（进行修改）三：相关代码1:index.jsimport React from 'react';import ReactDOM from 'react-dom';import TodoList from './TodoList';//第一步import {Provider} from 'react-redux';/...

2018-07-10 19:46:17 798

转载 Mac之常用快捷键

Mac中主要有四个修饰键，分别是Command，Control，Option和Shift。这四个键分别有自己的图案，他们经常出现在Mac应用程序中的菜单栏里，方便你随时学习新的快捷键。MAC 键盘快捷键符号图例通用Command是Mac里最重要的修饰键，在大多数情况下相当于Windows下的Ctrl。所以以下最基本操作很好理解：Command + Z 撤销Command + X 剪切Command...

2018-07-10 13:28:13 1474 1

原创 React之UI组件、容器组件以及无状态组件

一：三种组件的简单理解1.UI组件：只负责页面的渲染2.容器组件：只负责业务逻辑和数据的处理3.无状态组件：把UI组件用函数表示（可以省去生命周期函数，优化代码）二：具体代码注意：以上一篇文章举例点击打开链接 1.普通组件TodoList.js（拆分成TodoListUi.js(UI组件)和TodoList.js(容器组件)）import React ,{Compone...

2018-07-08 16:53:58 3128

原创 Redux之react的简单入门项目及其优化

注意：此Demo使用了react官方脚手架和antd一：目的在react中组件与组件之间的通信很麻烦，于是借用redux进行第三方的通信通过把数据存储在store里，实现各个组件间快速通信二：工作流程or注：store是一个联系和管理。具有如下职责维持应用的state；提供getState()方法获取 state 提供dispa...

2018-07-08 14:48:34 1156

原创 React之过渡和动画效果

1：效果图2：目录结构（利用官方脚手架进行删减）3：index.jsimport React from 'react';import ReactDOM from 'react-dom';import App from './App';ReactDOM.render(<App />, document.getElementById('root'));4：App.jsimp...

2018-07-07 17:05:51 5148 1

原创 React之生命周期函数

一：MountingcomponentWillMount():在组件即将挂载在页面的时刻自动执行render():componentDidMount():在组件挂载在页面后的时刻自动执行二：UpdationcomponentWillReceiveProps():需要满足三个条件才会执行一个组件要从父组件接受参数 ...

2018-07-07 11:40:52 308

原创 React之TodoLIst(涉及父子组件传值)

1：安装react官方脚手架注意：需要在计算机上安装Node> = 6和npm> = 5.2npx create-react-app my-appcd my-appnpm start2：调整目录结构3：index.js(程序入口文件)import React from 'react';import ReactDOM from 'react-dom';import TodoList...

2018-07-06 18:59:10 582

蓝莓味的鱼