随笔分类 -  React

React
react报错 TypeError: Cannot read property 'setState' of undefined
摘要:代码如下: class test extends Component { constructor(props) { super(props); this.state = { liked: false }; } handleClick(event) { this.setState({liked: !t 阅读全文

posted @ 2021-02-01 17:38 漫思 阅读(302) 评论(0) 推荐(0) 编辑

Vue中qs插件的使用
摘要:qs的下载地址 https://github.com/ljharb/qs 之前用Vue+element写了一个后台管理系统,在登录时使用axios请求数据传参时无法正常的获取数据。之后也是一通百度,发现原因是传递参数要将参数序列化。这里使用了qs插件: 简单来说,qs 是一个增加了一些安全性的查询字 阅读全文

posted @ 2021-01-18 14:32 漫思 阅读(1094) 评论(0) 推荐(0) 编辑

umi 的项目中如何修改 favicon
摘要:浏览器在解析html文件时会将类型为icon的link标签引用的图片作为网页的favicon,也就是网站标签左上角的小图标。 有两种方法加入link标签: 1. 在document.ejs中使用link标签 <head> <link rel="icon" type="image/x-icon" hr 阅读全文

posted @ 2020-11-02 17:32 漫思 阅读(3659) 评论(0) 推荐(1) 编辑

react监控props的变化
摘要:这篇文章还是有些含糊,建议后续补充一些 第一次的加载不会加载这个对象 componentDidUpdate(prevProps, prevState) {} //生命周期,重新绘制就引起影响。 state和props的变化都会引起冲绘制 //这个有些问题 不建议使用 第一次的加载不会加载这个对象 c 阅读全文

posted @ 2020-10-18 16:56 漫思 阅读(6487) 评论(0) 推荐(0) 编辑

如何使用懒加载 - umi
摘要:.umirc.js文件 plugins: [ dynamicImport: true, 阅读全文

posted @ 2020-10-18 16:55 漫思 阅读(1249) 评论(1) 推荐(0) 编辑

React的slot插槽
摘要:<script type="text/babel"> class Abox extends React.Component{ constructor(props) { super(props); } render() { return ( <div className="box1"> { this. 阅读全文

posted @ 2020-10-18 11:52 漫思 阅读(2463) 评论(0) 推荐(1) 编辑

React 的函数组件和类组件中的props
摘要:React 的函数组件和类组件中的props 函数组件 函数组件中的props是一个对象直接作为函数的参数传入,在组件内容中可以直接用点语法使用props对象中的属性,代码如下: function Test1(props) { return( <div> The user is <b>{props. 阅读全文

posted @ 2020-10-17 21:36 漫思 阅读(2674) 评论(0) 推荐(0) 编辑

Umi配置proxy解决跨域问题
摘要:解决跨域需要在webpack配置proxy,umi将webpack配置保存在.umirc.js的配置文件中。在.umirc.js文件加上: proxy: { '/api': { target: 'http://localhost:9093', pathRewrite: { '^/api': '' } 阅读全文

posted @ 2020-10-17 14:48 漫思 阅读(9758) 评论(0) 推荐(0) 编辑

react设置props的默认值
摘要:一般设置props的默认值有两种方式 指定 props 的默认值, 这个方法只有浏览器编译以后才会生效 class HandsomeBoy extends Component{ // 设置默认值 //defaultProps 可以为 Class 组件添加默认 props,基于 static 的写法 阅读全文

posted @ 2020-10-12 16:21 漫思 阅读(4464) 评论(0) 推荐(0) 编辑

Rx.js 的定位到底是什么?
摘要:Rx.js 确实带来了响应式的编程思维,可以说一定程度上改变了我思考编程问题的方式,但是我目前也只在 A 框架和 R框架中用到过Rx.js, 作用就是作为数据流管理工具,除了作为数据流管理工具它真正的用出是什么?还有什么其它妙用? 作者:欲三更链接:https://www.zhihu.com/que 阅读全文

posted @ 2020-10-12 14:39 漫思 阅读(198) 评论(0) 推荐(0) 编辑

RxJS JavaScript 的 Reactive 扩展
摘要:静态网页已经成为历史,如今的web设计趋势是预测客户想法并提供更好的互动功能,例如自动填写表单、搜索Wikipedia等。RxJS框架可以很方便地为鼠标和键盘事件提供响应。 示例代码: var $input = $('#input'), $results = $('#results'); /* On 阅读全文

posted @ 2020-10-12 14:37 漫思 阅读(137) 评论(0) 推荐(0) 编辑

React 组件生命周期
摘要:React 组件生命周期 在本章节中我们将讨论 React 组件的生命周期。 组件的生命周期可分成三个状态: Mounting:已插入真实 DOM Updating:正在被重新渲染 Unmounting:已移出真实 DOM 生命周期的方法有: componentWillMount 在渲染前调用,在客 阅读全文

posted @ 2020-10-11 22:18 漫思 阅读(189) 评论(0) 推荐(0) 编辑

React Ant Design Mobile 中 ListView 简单使用,搞懂每一行代码
摘要:初用Ant Design Mobile 中 ListView ,看到官方示例,新手朋友估计第一反应都是一脸蒙逼,现在我们写一个最简单的示例,除了让代码运作起来,也让大家知道每一行代码的作用 "dependencies": { "antd": "^3.26.11", "antd-mobile": "^ 阅读全文

posted @ 2020-10-11 22:15 漫思 阅读(3442) 评论(0) 推荐(0) 编辑

React-classnames库
摘要:核心观点 import styles from './index.css'; <h1 className={classnames([styles.title,styles.maliang])}>Yay! Welcome to umi!</h1> 另外是混乱的混杂模式 className={class 阅读全文

posted @ 2020-10-09 16:27 漫思 阅读(433) 评论(0) 推荐(0) 编辑

有关dispath的核心技能
摘要: 阅读全文

posted @ 2020-10-09 14:39 漫思 阅读(171) 评论(0) 推荐(0) 编辑

umi + dva + ant-design-mobile快速搭建H5项目
摘要:介绍 最近开发了一个react项目,因为之前都是做原生混合H5开发,对redux用的不怎么熟练,这次想要锻炼下然后花几天看了一下redux和看了几个搭建方案,以及看了下公司其他的H5项目(直接用redux的项目)觉得很复杂繁琐。用过ant-design-pro 2.0正式版(加入了umi的版本)觉得 阅读全文

posted @ 2020-10-06 10:15 漫思 阅读(1895) 评论(0) 推荐(0) 编辑

微信小程序报“app.json”错误解决办法
摘要:1、亲测 “app.json未找到入口 app.json 文件,或者文件读取失败,请检查后重新编译。” 是由于新创建的界面xxx.json所在的文件夹为0KB造成的,你可以试着在xxx.json文件内写点代码。可以在文件所在本地磁盘看看文件夹是否还为0KB,当不为0KB时编译就OK了。 是不是C盘没 阅读全文

posted @ 2020-10-05 23:58 漫思 阅读(2042) 评论(0) 推荐(0) 编辑

taro框架的缺陷以及注意事项
摘要:1.不要使用 eval() 2. 禁止使用 Object 构造器 let config = new Object() // ✗ 错误 3. 不使用 Generator 函数语法 使用 Promise 或者 async functions 来实现异步编程 function* helloWorldGen 阅读全文

posted @ 2020-10-05 22:57 漫思 阅读(4225) 评论(0) 推荐(0) 编辑

微信小程序Taro开发(2):生命周期及开发中注意点
摘要:生命周期 componentWillMount 在微信小程序中这一生命周期方法对应页面的onLoad或入口文件app中的onLaunch componentDidMount 在微信小程序中这一生命周期方法对应页面的onReady或入口文件app中的onLaunch,在 componentWillMo 阅读全文

posted @ 2020-10-05 22:54 漫思 阅读(514) 评论(0) 推荐(0) 编辑

react数组数据变化后不重新渲染,加了key也没有用?你更新数据的方法错了。
摘要:一般是初学react的同学才会出现这样的问题,虽然不难,却很困扰。这是因为数组,是引用,你虽然更新了数组,但是数组的引用地址没有变化,react就不会认为它有变化。所以,只需要在复制的时候,对之前的数组进行深拷贝,再将新的数组set给原来的变量,就ok了。附上之前写的深拷贝代码一份。 export 阅读全文

posted @ 2020-10-05 22:51 漫思 阅读(3852) 评论(0) 推荐(0) 编辑

导航