react
小小程序猿7
这个作者很懒,什么都没留下…
展开
-
安装项目报‘node’问题
解决方法yarn config set ignore-engines true即可解决,原理暂时不知参考文章https://www.cnblogs.com/xiaoqilaile/p/11755330.html原创 2021-07-15 06:50:40 · 422 阅读 · 0 评论 -
react 点击筛选--类似于boos直聘首页筛选--单选
首先应该想的是怎么写?react是操作数据来改变样式,就是要有一个数据来确定是不是给要点击的元素加一个className = { true_and_false ? "show" : null }就是给不给元素添加show这个class名字! 第二个就是判断是不是点击的自己,怎么能判断点击的是自己! <div index = { key } o...原创 2019-12-18 22:22:08 · 290 阅读 · 0 评论 -
react利用redux-thunk+axios获取后台数据
安装redux-thunk yarn add redux-thunk 在外层store文件夹下的index.js中使用 import { createStore , compose , applyMiddleware } from 'redux';import thunk from 'redux-thunk';import reducer fr...原创 2019-06-24 17:37:57 · 425 阅读 · 0 评论 -
react ---redux-immutable 使获取行为统一
安装redux-immutable yarn add redux-immutable 打开项目的总文件夹中的store文件夹里面的reducer.js 把combineReducers组件用redux-immutable import { combineReducers } from 'redux-immutable' 进入header文件下的inde...原创 2019-06-24 14:07:22 · 122 阅读 · 0 评论 -
react 使用immutable.js 使state不能改变
https://github.com/immutable-js/immutable-js---git地址 项目安装immutable.js yran add immutable 在reducer.js中引入 import { fromJS } from 'immutable'; 1 return state.set('focused',true)...原创 2019-06-24 11:48:17 · 223 阅读 · 0 评论 -
react的路由Router
import React from 'react';import { Provider } from 'react-redux';import { BrowserRouter, Route } from 'react-router-dom';import store from './store';import Header from './common/header/index';im...原创 2019-06-26 16:43:25 · 64 阅读 · 0 评论 -
react reducer的拆分 整合 combineReducers
在组件文件夹下创建一个文件夹store 下面创建也个reducer.js const defaultState = {}export default (state = defaultState,action) => { return state;} 项目下的store文件下的reducer.js用combineReducers整合 ...原创 2019-06-22 21:03:08 · 313 阅读 · 0 评论 -
redux使用Redux DevTools
科学上网在chrome商店中安装 然后你的控制台会多一个redux的选项 进如gitHub上搜索redux-devtools-exten 里面的1.2Advanced stote setup 教你使用 在项目中找到stroe文件夹中的index.js文件 import { createStore , compose} from 'redux';import reducer fro...原创 2019-06-22 17:46:40 · 93 阅读 · 0 评论 -
react 中的redux的使用
在项目中安装redux yarn add redux yarn add react-redux 首先创建一个store文件夹 在store文件夹中创建一个index.js文件 在index.js中创建一个实例 import { createStore } from 'redux'const state = createStore();export default s...原创 2019-06-22 17:39:51 · 94 阅读 · 0 评论 -
react中使用 react-transition-group 实现动画效果
在项目中安装:yarn add react-transition-group 在要使用动画的页面 引入 import { CSSTransition } from 'react-transition-group' 想让那个标签有动画效果就在那个标签外边用<CSSTransition>标签包裹就行了 标签的属性: <CSSTransition ...原创 2019-06-22 17:13:40 · 252 阅读 · 0 评论 -
react 使用矢量图标--阿里的矢量图
打开图标网站https://www.iconfont.cn/ 登陆自己的账号进入我的项目----在上面的导航条里 新建一个项目--右边有一个紫色的加号 在上面搜索框搜索你需要的图标 找到你需要的图标鼠--标移上去 点击收藏 点击右上角的购物车添加至项目 然后下载至本地 然后把下载的文件夹解压 保留这五个文件 iconfont.eot iconfont.svg iconfo...原创 2019-06-22 15:52:23 · 1084 阅读 · 0 评论 -
react css模块管理工具 styled-components
首先全局安装 yarn add styled-components 使用 引入的样式文件不再事css文件,都改成js文件,但是引入方法还是css的引入方法。 在样式文件中引入: import { createGlobalStyle } from 'styled-components'; 全局样式添加样式都导出: 搜索全局样式文件reset.css,然后复制里面的内容...原创 2019-06-22 09:57:12 · 222 阅读 · 0 评论 -
react 项目搭建
全局安装 脚手架工具: npm install -g create-react-app 安装项目: create-react-app <项目名称> 进入项目文件夹 cd <项目文件名称> 运行项目 npm start ...原创 2019-06-22 09:45:06 · 51 阅读 · 0 评论