
react
文章平均质量分 80
柒月梦
不忘初心,方得始终。
有问题可以邮箱 15755881430@163.com
展开
-
MobX5笔记
简介mobx是一个简单、可扩展的状态管理库。MobX 浏览器支持MobX5 任何支持ES6 proxy的浏览器 不支持IE11 node6MobX4 任何支持ES5的浏览器MobX4 和 MobX5的API是相同的开发前准备启用装饰器语法支持(方式一)npm run eject 暴露配置下载装饰器语法babel插件 npm i @babel/plugin-proposal-decorators在package.json文件中加入配置启用装饰器语法支持(方式二)npm原创 2021-08-04 17:41:59 · 531 阅读 · 2 评论 -
通过JS实现点击复制页面表格到Excel
本文基于react项目实现。起因接了一个需求,要求实现点击页面上的一个按钮,复制某个表格数据,然后ctrl+V到Excel表格中。思考其实我觉着这个功能用导出Excel的方式实现不就好了么。不过本着好奇的心思,还是试着做做看吧。首先,点击按钮的时候要拿到要复制的数据。最初是想通过获取DOM元素的方式来取得表格,可是这样的话,得到的就是含有html标签的一堆字符串。那么只能自己来拼装数据了。我把表格部分的数据通过复制、黏贴到编辑器看下他是什么,结果如下图:而页面上的表格是这样的:对比来看:跟原创 2021-02-05 17:52:24 · 6713 阅读 · 7 评论 -
React样式模块化解决方案--styled-components
介绍styled-components是一个css in js 类库。可以防止css样式污染、组件更改时更容易定位到相关的样式。它使用标签模板来对组件进行样式化。它移除了组件的样式之间的映射。这意味着,当你定义一个样式时,实际上只是创建了一个普通的React组件,定义的样式也附在它上面。由于React对css的封装非常弱,导致了一系列第三方库,用来加强React的CSS操作(统称 CSS in JS,使用JS语言写CSS)另一个CSS in JS库 polished起步1、创建react项目原创 2021-01-21 19:20:57 · 705 阅读 · 0 评论 -
用react搭建一个管理后台(二)
用react搭建一个管理后台(一)1、重置样式/*! minireset.css v0.0.4 | MIT License | github.com/jgthms/minireset.css */html,body,p,ol,ul,li,dl,dt,dd,blockquote,figure,fieldset,legend,textarea,pre,iframe,...原创 2020-02-08 23:12:02 · 331 阅读 · 0 评论 -
用react搭建一个管理后台(一)
1、初始化react项目npm install create-react-app -g create-react-app react_democd react_demo npm run start2、建立一个远程的空的仓库在码云或GitHub上建立一个空的仓库。并将本地库和远程库关联。在本地项目库中依次执行:git init //初始化git仓库git add ./ git...原创 2020-02-04 22:29:09 · 1100 阅读 · 0 评论 -
create-react-app创建项目后引入ant-mobile主题定制
1、新建一个项目,create-react-app demo2、引入ant-mobile UI库。ant-mobile根据官网在create-react-app中使用引入UI库。3、定制主题这里有坑!!根据官网怎么都没弄好。 npm install --save-dev babel-plugin-import less less-loader style-loader css-load...原创 2019-06-21 17:35:59 · 983 阅读 · 1 评论 -
webpack构建react应用
一、新建一个文件夹。 mkdir webpack-react-demo二、在此文件夹下创建package.json文件右键新建文件也行。这里使用 npm init 初始化项目的方式自动生成。在webpack-react-demo文件夹下进入CMD命令行,输入npm init,一路enter就行。三、安装相关的依赖包react相关: react 、react-dombabel相关:...原创 2019-06-19 16:01:05 · 233 阅读 · 0 评论 -
react-native开发环境搭建---win10系统
1、安装node。官网下个安装包node -v查看下版本号。2、安装jdk。jdk安装包我是电脑管家里搜的。下载安装后,一定要配置一下环境变量。参考3、安装Android studio。安装包链接:https://pan.baidu.com/s/1sfvcf-rv6HOUgiHjPD_dkQ提取码:pszg网上下载也行。3.1 安装Android SDKreact ...原创 2019-05-29 17:39:50 · 551 阅读 · 0 评论 -
react基础学习四 --- 组件通信、过滤、生命周期
1、组件传参1.1 父组件–>子组件父组件中通过子组件的属性传递,子组件通过props接收。//父组件 class ParentList extends React.Component{ constructor(){ super(); this.state = { ...原创 2019-04-16 21:32:40 · 166 阅读 · 0 评论 -
react脚手架的使用
一、全局安装create-react-appcnpm i -g create-react-app 二、使用create-react-app创建一个democreate-react-app react01三、进入项目,并启动项目cd react01cnpm start原创 2019-04-11 18:23:25 · 217 阅读 · 0 评论 -
react基础学习三 --- 数据双向绑定
react的双向数据绑定需要自己来实现,不像vue那样可以直接使用v-model指令。react的表单元素可分约束性和非约束性两种。非约束性组件不受到react的约束,value的值有原生DOM管理,value要写成defaultValue。<input type="text" defaultValue="123"/>约束性组件value的值受到react的状态state...原创 2019-03-28 10:46:21 · 254 阅读 · 0 评论 -
react基础学习二 --- 数据循环展示、组件定义、事件绑定
一、数据循环展示方式一、使用map循环数组. var arr = ['a','b','c','d']; ReactDOM.render( <div> { arr.map((item,index)=>{ ...原创 2019-03-25 16:43:11 · 1113 阅读 · 0 评论 -
react基础学习一 react的使用及创建虚拟DOM的方式
&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport" conten原创 2019-03-14 21:15:28 · 340 阅读 · 0 评论