![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
ReactJS
Quincy379
坚持、冷静
展开
-
ReactJS之JSX的语法
1.首字母大小写 2.嵌套 3.求值表达式 4.htmlFor和className 5.驼峰命名 M1<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Hello World</titl原创 2018-03-17 15:01:21 · 271 阅读 · 0 评论 -
ReactJS之移除对象代码记录
//移除单项channel_languageremoveOldItem = (item, index) => { // console.log('移除单项channel_language', item); let allChannelDt = this.state.languageDt; console.log('===>>>',allChanne...原创 2018-05-03 09:53:14 · 766 阅读 · 0 评论 -
Antd之三元表达式判断代码备忘
{ Object.keys(Version || Object).map(key => { return ( <TreeNode title={key + ' : ' + this.state.gVersion && key === 'Version' ? ...原创 2018-04-25 09:51:57 · 1687 阅读 · 1 评论 -
ReactJS之对象数组去重实现
题记:前端基础太差,生怼了半天没写出来,搜了半分钟出来了,哈哈~//数据去重function unique(ds){ let result = {}; let finalResult=[]; for(let i=0;i<ds.length;i++){ result[ds[i].key]=ds[i]; } ...原创 2018-04-20 14:35:22 · 5124 阅读 · 0 评论 -
Antd之清空表单数据后,校验空值无法显示提示信息解决方案(二)
接上回:https://blog.csdn.net/qq_33733970/article/details/80049371//解决校验空值不显示问题setTimeout(this.props.form.resetFields,3000); 解决方案:let myClear;handleSubmit = (e) => { e.preventDefa...原创 2018-04-23 14:10:23 · 6018 阅读 · 3 评论 -
Antd之表单清空操作(一)
handleSubmit = (e) =&amp;gt; { e.preventDefault(); this.props.form.validateFields((err, values) =&amp;gt; { if (!err) { console.log('Received values of form: ', values); }...原创 2018-04-23 13:37:36 · 28447 阅读 · 0 评论 -
ReactJS之antd实现国际化
import {LocaleProvider} from 'antd';import zh_CN from 'antd/lib/locale-provider/zh_CN';<LocaleProvider locale={zh_CN}><div></div></LocaleProvider>原创 2018-04-13 09:47:32 · 4521 阅读 · 1 评论 -
ReactJS之生命周期方法
这些方法是嵌入到ReactJS组件生命周期内的钩子函数,可以在ES6类组件中使用,但是不能在无状态组件中使用。先了解下constructor和render:constructor: 会在组件实例化并插入DOM时才会调用,组件实例化过程被称为组件的挂载(mount)。render: 会在组件实例化过程中或者在组件更新过程中被调用。当组件的state或者pro...原创 2018-04-06 18:39:02 · 509 阅读 · 0 评论 -
ReactJS之存储全局变量数据
For you: https://medium.freecodecamp.org/where-do-i-belong-a-guide-to-saving-react-component-data-in-state-store-static-and-this-c49b335e2a00 抽空扒并翻译一下!class App extends React.Component { ...原创 2018-04-11 09:14:07 · 11143 阅读 · 0 评论 -
ReactJS之遍历对象的方法
const obj = { channel: “wevmvmklskdosll12k;0”, index:0 };Object.keys(obj).map(key => console.log(obj[key])); 有ES6语法,必须搭配Babel使用…原创 2018-04-09 08:26:15 · 21209 阅读 · 0 评论 -
Install Yarn Ubuntu 16.04 (Linux Mint 18.1)
原文链接:https://stackoverflow.com/questions/42606941/install-yarn-ubuntu-16-04-linux-mint-18-1具体的先不分析了,看下上面说的按照步骤就搞好了装好yarn后如果需要升级node: npm cache clean npm install n -g n stable ...原创 2018-03-24 11:01:17 · 1447 阅读 · 0 评论 -
ReactJS之组件协同使用
组件的嵌套(纵向): 父子关系: 父组件通过属性和子组件进行通信; 子组件通过事件处理函数把事件委托给父组件进行处理Mixin(横向):...原创 2018-03-18 13:08:27 · 232 阅读 · 0 评论 -
ReactJS之事件对象的使用
事件的分类:触摸事件: #onTouchCancel; #onTouchMove; #onTouchEnd; #onTouchStart;键盘事件: #onKeyDown; #onKeyUp; #onKeyPress剪切事件: #onCut; #onPaste; #onCopy;表单 #onChange; #onInput; #onSubmit;默认事件...原创 2018-03-18 10:55:35 · 1524 阅读 · 0 评论 -
ReactJS之属性和状态的对比
## 1. 都是纯JS对象 ## 2. 都会触发render的执行 ## 3. 都有确定性状态(state)是由组件本身进行维护和修改的,组件外部是无法进行修改的属性(props)组件自身具有的特性,是无法被自身修改的。但是父组件是可以修改子组件的属性,子组件也可以从父组件获取属性值属性和状态的区分方法 组件在运行时需要修改的数据就是状态,这和前面的概念相辅...原创 2018-03-17 17:45:54 · 327 阅读 · 0 评论 -
ReactJS之利用axios发送请求完成界面渲染代码示例
import React from 'react';import ReactDOM from 'react-dom';import axios from 'axios';class FetchDemo extends React.Component { constructor(props) { super(props); this.stat...转载 2018-03-17 17:17:55 · 3497 阅读 · 0 评论 -
ReactJS之属性的使用
键值对:<HelloWorld name="Quincy"></HelloWorld><HelloWorld name={123}></HelloWorld><HelloWorld name={"Quincy"}></HelloWorld><HelloWorld name={原创 2018-03-17 17:02:32 · 282 阅读 · 0 评论 -
ReactJS之非DOM属性节点
*dangerouslySetInnerHTML<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Hello World</title></head>&原创 2018-03-17 15:51:10 · 226 阅读 · 0 评论 -
antd之1.5米长三元表达式
{/*预留*/}<TreeNode title={'Statistics'} key={'Channel_Statistics_' + item.Index + '_' + idx + '_Channel-Statistics'}> <TreeNode //根据idx===parseInt(this.state.channelStatis...原创 2018-04-26 09:21:59 · 298 阅读 · 0 评论