React搭建个人博客
个人博客搭建前言项目预览 http://lurenhong.top/登录页 (个人使用暂时未开发注册功能)添加标签(方便后期条件查询)添加博客内容以及标签选择 (草稿/发布)展示博客列表(编辑/删除/条件查询及分页)博客展示首页(后台添加博客不对外开放)博客详情页查看(目前已完成阅读量/评论功能开发...
使用 MobX 开发 React Native 应用 @observer 引用报错
本文将 MobX 与 React Native 结合,编写一个简单的列表客户端。这是学习使用 MobX 和 React Native 的一个不错的起点。查看最终的代码库,点击这里。MobX 是一款精准的状态管理工具库,对我来说非常容易学习和接受。我在 React 和 React Native 应用中...
【React】React18+Typescript+craco配置最小化批量引入Svg并应用的组件
React18+Typescript+craco配置最小化批量引入Svg并应用的组件 前言创建React + Typescript项目通过require.context实现批量引入Svg安装[@types/webpack-env](https://github.com/DefinitelyT...
解决升级到Xcode10,react native项目运行报错问题
今天刚升级到Xcode10,就遇到两个报错问题错误一:Xcode 10: Build input file double-conversion cannot be founderror: Build input file cannot be found: '../node_modules/react...
React-Native与安卓原生的混合开发
写在前面目前很多大厂APP(如淘宝、饿了么、美团等等)并不是纯原生Android&IOS,也不是纯JS开发,而是Hybird APP开发,混合型优势很多:比如热更新,保证在一些类似双十一的活动到来时能够快速上线活动页面,用户不必再去更新APP。再来有效地减小了安装包的体积大小,大部分的界面都...
【react实战】如何开发嵌入客户端的H5页面黑白模式?
需求:提供用户自行选择的主题模式:黑/白。默认情况下,是白色主题。用户选择的数据传递给后端,然后获取接口(已知接口:DarkMode())。1.首先写好黑/白模式下的CSS文件.2.在app.js里,在生命周期函数componentDidMout() { }页面加载的时候去判断:定义一个全局变量:—...
React Native 使用百度 Echarts 图表之 Android 端打包后图表不显示的解决办法
参考资料:React Native使用百度Echarts显示图表前言:1.Echarts是百度推出的免费开源的图表组件,功能丰富,涵盖各行业图表。2.Echarts组件是兼容IOS和安卓双平台的。安装:在React Native项目中安装native-echarts组件,代码如下所示:npm ins...
react-native 屏幕尺寸和文字大小适配
现在的手机品牌和型号越来越多,导致我们平时写布局的时候会在个不同的移动设备上显示的效果不同,比如我们的设计稿一个View的大小是300px,如果直接写300px,可能在当前设备显示正常,但到了其他设备可能就会偏小或者偏大,这就需要我们对屏幕进行适配。安卓原生的话有自己的适配规则,可以根据不同的尺寸建...
React(二)实现双向数据流
<div id="app"></div><script src="bower_components/react/react.min.js"></script><script src="bower_components/react/react-do...
react native 之 webstorm开发(windows)
前言:作为Android开发的老司机,前端时间我在windows上面把reactnative项目做了一个流程的研究,同时也把相关的博客给贴了出去。今天考虑到reactnative的js的书写需要开发工具,就看了一下网上的各种资料,最后选了webstorm作为自己开发reactnative的工具来走了...
React 开发一键生成代码快
我们用的VS code 开发工具,它提供好多强大的插件,安装这些插件可以极大的提高我们的开发效率。1.首先打开VS code 插件,搜索一下两个插件名称,点击右下侧的install点击某个插件,可以查看Details,里面有好多快捷键示例。比如常用的:rcc, rfc, imrc, imr, ccs...
谈一谈React的setState的执行机制
React组件显示什么样的数据,都是由数据状态和外部参数所决定的,这个数据状态就是state。 当需要修改数据状态的值,就要调用setState,从而达到更新组件内部数据状态的目的。比如代码: class App extends React.Component { constructor(p...
对比:React 还是 Vue
自己之前的开发栈一直是 Vue,对 Vue 的设计理念及底层实现原理算是颇有了解;随着公司技术迭代,近半年来开始接触&使用 React。 前面写了几篇关于 React 的文章,但大部分都是知识点以及开发过程问题的沉淀总结。 这篇文章想尝试聊一下,从个人使用角度,???? React 和 Vu...
超级好用的图片预览查看插件Viewer及在react,vue,jquery以及原生js的使用方法,详解react复用单个组件的写法
因为项目种常查看大图预览的需求,如果是自己写的用模态框写的查看大图,只是简单看看还可以,如果需要旋转,放大缩小,反转等等操作,就会很麻烦。也看过很多用来查看大图的插件,viewer真的是功能最为全面的,而且在各个框架中均有对应的封装插件,使用起来也很方便,所以这里写一下各个框架内viewer的使用方...
react-router-dom之异步加载路由
这篇文章跟https://blog.csdn.net/qq_40816649/article/details/90172681衔接在一个spa单页面应用中如果项目较小的话异步组件可能影响不大,但是如果是一个大的react单页面项目如果没有使用异步组件,页面会在第一次加载的时候加载所有项目中所有的组件...
[React/Error: Minified React error #130]
最近在研究前端React,发现坑特别的多,尤其是对于我这种埋头死磕的人,低级错误很多: 当用webpack打包完 React之后,到页面去测试执行,发现报错:首先查看webpack配置文件,发现均无问题,如果有问题,那么在我执行webpack命令的时候他就会报错,其次查看源文件导入 测试单一代码发现...
react-native键盘遮挡TextInput问题
前言:在实际的 react-native 项目中,使用输入框 TextInput 组件是十分常见的。但是,在手机上(特别是ios平台),键盘弹出后遮挡视图(一般都是 TextInput 组件)的问题也是经常出现的。遮挡示例:在这样的效果中,这个页面的视图(包含顶部标题栏)是由 Container(n...
react中使用ztree,对ztree样式进行修改,ztree样式风格antd化
由于react里面使用ztree【https://blog.csdn.net/Chris__wang/article/details/86001063】 但是会发现ztree的样式风格与antd里面的tree风格大不相同,对比两者 前两个带颜色的是ztree的,后面的是antd的, 对比发现ztr...
React Native 0.49以后的版本正式宣告了Navigator API的死亡
Navigator的生命历程:React Native 0.43.0: React Native官方宣布,停止维护Navigator API,停止维护之后,可从react-native-deprecated-custom-components继续使用NavigatorReact Native 0.4...
【generate】如何维护一套icon组件库,直接输出svg为react component
https://github.com/ant-design/ant-design-web3/pull/761/files 实现了icon-preview(通过jsdoc, 鼠标放在组件上可以看到icon的样式),因为打包方式、产物以及命名上有一些不同,可能需要稍加改造。 这个同步脚本应该后续也...