卡卡罗特的博客

在生产环境，前端的静态资源包，可能部署到任意服务器；后端服务提供的接口地址，可能任意的地址，那就需要我们的HTTP请求的接口地址是可配置的，不然每次部署前，先改下地址，打个包再部署极其不便。比如需要配置一些全局的参数之类的：react项目：第一步：在public(static)文件夹，新建个env.js，配置全局window对象属性第二步：在index.js 入口文件，遍历配置的对象属性，写入本地浏览器缓存，然后随时调用if (window.envConfig) { Objec

在开发过程中，input的用户输入的值，绑定的onchange事件，如果没敲一次键盘，执行一次方法，请求一次数据的话就很耗内存了；这里用一下lodash<script src="https://cdn.jsdelivr.net/npm/axios@0.12.0/dist/axios.min.js"></script><script src="https://cdn.jsdelivr.net/npm/lodash@4.13.1/lodash.min.js"><

在做一些表单类数据时，需要根据当前输入的值，像后台请求不同的数据；每次键盘输入都会调用接口API，太别频繁；能不能等用户不在输入了，在请求后端，做个延迟；这里就需要用到lodash了，话不多说上代码：1.安装lodash插件npm install lodash2.引入插件开干/* * CRH文件下载 */import React, { Component } from "react";import Storage from "store2";import axios fro...

最近开发项目中，做管理后台，很多表格列表，有搜索条件，有分页；在跳转到详情页面，返回时，列表组件重新渲染，之前的搜索条件，分页什么的，都没有记住；还需要重新选，点击，交互体验很不好。1.这里想到2两个办法，一个是吧搜索条件存到缓存中；每次进行读写；条件太多，或者多个上级页面跳转到同一页面，再返回是还得区分，很是麻烦。而且点击浏览器的返回按钮，没办法记录这里我们用路由传递，参数的办法；上级页面把搜索条件传给，下级页面；下级页面返回时，在传给上级页面主要看，state和history传值就行了上

在开发项目中，用到了富文本编辑器，给后台传的字段值是html的字符串，比如“<div><p>123456</p></div>”回显显示的时候，后台返回的也是 text: “<div><p>123456</p></div>”原生js,你可以用 innerHtml来搞定了。此时在react，jsx的中如何回显呢？方案一: 写个div，原生js来搞<div className="strTmp.

background-image: url("/timg.jpeg");直接"/"就是相当于当前项目根目录下

一、 快速开始：全局安装脚手架：npm install -g create-react-app复制代码通过脚手架搭建项目：create-react-app <项目名称>复制代码开始项目：cd <项目名>npm run start复制代码二、 查看项目 package.json 信息2.1 package.json 一览{ ....

最近在开发react项目中使用到了打印功能1、使用react-to-print插件（npm自行安装）import React from 'react';import ReactToPrint from 'react-to-print';import ComponentToPrint from "srcDir/pages/internalNanjing/summaryStatistic...

import React, {Component} from 'react';import {Text, View, TouchableOpacity} from 'react-native';export default class Parent extends Component { render() { return( <Vie...

1.跳转传参：this.props.history.push({pathname:"/list", query: { “id”: 123, "canshuB": true,}});2.页面接收获取参数：const id = this.props.location.query.id;...

最近在开发react项目时，父组件向子组件传值，例如：向子组件传递的moneyArray 是向服务器请求而来，而且是随时改变的。<ValutaTable moneyArray={moneyArray} />如果子组件只是想用第一次的值，这里就需要使用深拷贝的方法来存储第一次的值子组件代码如下： constructor (props) { super(p...

在react中父组件在向子组件传值时，如果父组件的值发生了改变，子组件的接收的参数值也需要接收最新的值，更新组件这里就需要使用componentWillReceiveProps(nextProps)，react生命周期中，可以在子组件的render函数执行前获取新的props，从而更新子组件自己的state。例子：父组件向子组件传值,子组件接收父组件参赛：import ...

在react 循环，触发事件时，修改state里面的值，报如下错误：Maximum update depth exceeded. This can happen when a component repeatedly calls setState inside componentWillUpdate or componentDidUpdate. React limits the number ...

react项目遇到如下报错：This synthetic event is reused for performance reasons. If you're seeing this, you're accessing the method `preventDefault` on a released/nullified synthetic event. This is a no-op fun...

import React, { Component } from "react";import { Table, Storage } from "carrot";import Request from "srcDir/util/request";import { Tabs, Card, Button, Modal, Tree, notification } from "antd";imp...

1.跳转页面并传递参数this.props.history.push("/detail", {dotData: record});2.在detail页面回去参数 const messages = this.props.location.state.dotData 

不管是react还是vue项目（基于node.js），在工作中在git上拉取别人的项目代码文件后，都需要npm install 安装一下项目运行的依赖包。在后续的工作中我们可能要用到各种各样的插件等，我们就需要在开发或者生产环境下安装相应的依赖包。关于npm安装的包依赖管理的问题。单个依赖包管理是这样的：我们在使用npm install 安装模块或插件的时候，有两种命令把他们写入到 pac...

在实际项目开发过程中，我们从git上拉取的代码，在不同的操作系统，npm 安装的依赖包，里面是有区别的（如bin文件夹，sass文件夹）；所以需要注意不同的依赖包版本问题；config.entry.unshift("babel-polyfill"); // 转换ES5语法，兼容Chrome33报错1：react-app-rewired 不是内部命令原因：可能在windows系统，直接引...