
react
清风乐鸣
前端开发工程师
展开
-
React—native 之 Navigator (导航路由)组件
# React Native 的 Navigator 组件> 欢迎Follow我的GitHub: https://github.com/SpikeKing**React Native**的编程思想类似于``iOS``, 导航栏也使用``Navigator``作为标识, 类似于``Android``的``ActionBar``. 导航栏作为最重要的应用组件之一, 除了处理页面原创 2016-12-07 17:17:08 · 1328 阅读 · 0 评论 -
三端开发调研之京东Taro
三端开发调研之TaroTaro 是由凹凸实验室打造的一套遵循 React 语法规范的多端统一开发框架。使用 Taro,我们可以只书写一套代码,再通过 Taro 的编译工具,将源代码分别编译出可以在不同端(微信小程序、H5、App 端等)运行的代码。实现 一次编写,多端运行。和JDreact的关系Taro 是基于 Nerv.js 搞的。Nerv 是在 2017 年初就已经开发了的基于 v...原创 2019-03-07 09:37:08 · 777 阅读 · 0 评论 -
知乎项目代码阅后总结
项目源地址源码地址项目中增加Reactotron:使用方法项目中的问题[白图为源码,彩图为修改后的正确代码]:setStateaxios请求回来的数据回填到setState中,应该只调用一次setState一个页面需要调用2次接口才能渲染出时候,应该用回调改为回调axios,同时setState只设置一次个人还是比较崇拜先定义后导出的写法ex...原创 2018-12-19 10:47:05 · 401 阅读 · 0 评论 -
React项目打包部署到服务器上的遇到的问题
上一篇我我们讲到关于vue-cli的项目部署的一些小坑,但是对于React项目,如果用create-react-app脚手架运行npm run build后,直接把build文件夹扔到服务器,也会出现同样的问题,怎么才能直接点击运行index.html呢???最简单的方法:个人比较推荐这种,省事----修改package.json修改配置文件----node_modules/reac...原创 2018-12-19 22:38:53 · 3252 阅读 · 5 评论 -
<Link>s rendered outside of a router context cannot navigate<React-router报错>
今天这个问题找了好久,终于找到为什么了,我们在百度上搜这个问题基本上只有一个答案点击打开链接其实不是说人家回答的不对,只是比较含糊,看截图:其实答案就是这样的,当我们在用react-router的时候,react-router的思想就是让我们写成一个单独的组件Navigation.js,然后import进来,通过this.props.children 传递给各路由原创 2018-02-01 20:17:41 · 1196 阅读 · 0 评论 -
利用Gulp搭建最新版React.js16.0版本开发环境
传送门,直达 GitHub 源码原创 2017-12-30 10:56:45 · 592 阅读 · 0 评论 -
React点击谁谁显示
实现效果如下:首先 app.js 组件代码import React, { Component } from 'react';import ReactDOM from 'react-dom';import Btn from './button'class App extends Component { constructor(props){ super(props)原创 2017-12-07 15:41:59 · 1599 阅读 · 0 评论 -
React仿豆瓣网项目
[https://github.com/QTFYING/douban](https://github.com/QTFYING/douban)原创 2017-12-06 10:30:51 · 853 阅读 · 0 评论 -
React 使用技巧总结 <二>
7. 渲染一个木偶组件import React from 'react';function NotFound(props) { return ( <div>NotFound</div> )}export default NotFound; 8.ES5 的时候,一个页面可以有多个 React.createClass,同理在 class 类中一个页面中也可以有多个 class 类原创 2017-12-01 23:48:44 · 410 阅读 · 0 评论 -
React使用技巧总结 <一>
1. 当渲染的只有一个目标元素的时候可以直接省去 returnfunction FormList({ color = 'blue', text = 'Confirm'}) { return( <button className = {`btn btn-${color}`}> <em>{text}</em> </button> )}const FormList原创 2017-12-01 23:38:10 · 1959 阅读 · 1 评论 -
开发 react 应用最好用的脚手架 create-react-app
1. 介绍在开发react应用时,应该没有人用传统的方法引入react的源文件(js),然后在html编辑吧。大家都是用webpack + es6来结合react开发前端应用。这个时候,我们可以手动使用npm来安装各种插件,来从头到尾自己搭建环境。比如:npm install react react-dom --savenpm install babel babel-loa...原创 2017-11-29 15:15:43 · 73062 阅读 · 10 评论 -
React Router 页面传值的四种方法
注:本文示例React Router版本为:3.0.2,使用前请注意检查版本一. props.params官方例子使用 React router 定义路由时,我们可以给<Route>指定一个 path,然后指定通配符可以携带参数到指定的 path: 首先定义路由到 UserPage 页面:import { Router,Route,hashHistory} from 'react-...原创 2017-09-11 23:07:58 · 33158 阅读 · 5 评论 -
React组件refs详解
ref顾名思义我们知道,其实它就可以被看座是一个组件的参考,也可以说是一个标识。作为组件的属性,其属性值可以是一个字符串也可以是一个函数。其实,ref的使用不是必须的。即使是在其适用的场景中也不是非用不可的,因为使用ref实现的功能同样可以转化成其他的方法来实现。但是,既然ref有其适用的场景,那也就是说ref自有其优势。关于这一点和ref的适用场景,官方文档中是这样说的: 在从 render原创 2017-08-15 00:40:54 · 959 阅读 · 0 评论 -
React Native 狗狗说初步搭建
**本人个人交流群:495807302。**前几天做了一个案例—- 狗狗说(慕课网),由于原视频比较采用 react native 0.22 版本,好多东西都不匹配,查阅一下资料,把其中的坑给大家说一下:1. 首先我们来进新建项目由于国内 npm 被墙,所以我们一般都是通过淘宝镜像来进行项目的安装:$ sudo npm install -g cnpm --registry=https://regis原创 2017-03-18 20:49:34 · 1703 阅读 · 0 评论 -
再次浅谈ReactDom.render( )
今天遇到一个问题,在用creat-react-app脚手架搭建React项目的时候,我们能不能在index.js这个页面传值或者写其他的函数呢,我一开始以为是不可以的,但是没想到试试后竟然也是OK的,就拿属性延展来举例子吧:原来页面:import React from 'react';import ReactDOM from 'react-dom';import './index.cs...原创 2019-04-02 15:59:01 · 1545 阅读 · 0 评论