react 和 vue 全局组件的实现方式

有时候,我们需要将组件定义为全局组件,即组件在 HTML 根上,在任何地方都可以调用,比如 Alert 组件。 react 版import React from "react"; import ReactDOM from "react-dom"; import Alert from "./Alert"; const AlertWrapper = props => { return ...

React 笔记

react-redux注:react-native + react-redux 的配置说明请看我另一篇文章。 和 web 版略有不同。 一个简单的例子import React from "react"; import ReactDOM from "react-dom"; import { createStore, combineReducers } from "redux"; import ...

React-Navigation 使用笔记

React-Navigation 之自定义 HeaderReact-Native 的新版本取消了 navigator,使用了新的 React-Navigation 组件。这个组件非常强大。 但是有的时候我们需要自定义 Header,又不想在每个 View 上附带 Header,而是想要实现原生的效果(即 Header 是一个独立的层,和视图无关)。 参考官方文档: 普通用法:在每个Stack...

React-Native 搭建开发环境

安装 RN 脚手架和 yarn:npm i react-native-cli yarn -g创建项目:react-native init demo如果 init 太慢,可以使用淘宝的镜像 // 查看下载源 yarn config get registry // 更换为淘宝源 yarn config set registry https://registry.npm.taobao.org 启动...

React 路由动画新写法尝试

实现前进和后退的不同动画。 .left-enter { position: absolute; top: 0; bottom: 0; width: 100%; z-index: 10000; opacity: 1; transform: translate3d(100%, 0, 0); } .left-enter.left-enter-active { op...

React 中实现下拉刷新

下拉刷新在手机上的体验差一直是webapp的痛点,最终我发现了这款组件。 安装npm install react-pull-to-refresh 使用handleRefresh(resolve, reject) { // do some async code here if (success) { resolve(); } else { reject(); ...