
前端框架
文章平均质量分 77
陈袁
有梦想,一定要成功
展开
-
前端框架Vue.js的使用及具体页面跳转时的参数传递
由于项目急且前端开发人员只会拼页面具体数据交互不会,只能我后台开发人员来写。因为是数据交互使用的是ajax方式,我首先要面临的问题是我获得的数据怎么显示在页面上,以及怎么把数据保存下来,等页面跳转时就不用向后台再次请求数据,比如用户名以帐号相关基础信息,不可能每次打开新页面都向后台请求一下,太麻烦且交互数据太多。我首先想到的是H5里的LocalStorage,SessionStroage保存数原创 2017-04-23 17:13:03 · 60455 阅读 · 6 评论 -
模块开发之redux-devtools-extension调试工具使用详解(十一)
模块开发之redux-devtools-extension调试工具使用详解(十一)模块开发之redux-devtools-extension调试工具使用详解(十一)前言安装调试工具插件非侵入式没有使用中间件的情况使用中间件情况侵入式安装没有使用中间件的情况使用中间件情况总结在chrome浏览器里实战前言redux-devtools和r...原创 2018-07-02 18:58:23 · 17046 阅读 · 1 评论 -
模块开发之react-router使用(八)
前言本文件使用ES6模块加载方式,不是CommonJS,CMD,AMD模块规范。React-Router4由3部分组件,react-router,react-router-dom和react-router-native。其中react-router是核心模块,网络开发只要引入react-router-dom即可,他已经暴露了react-router核心模块里接口引入模块EC6引入模块方...原创 2018-06-27 22:41:49 · 1040 阅读 · 0 评论 -
模块开发之React使用第三方库PropTypes属性限制(十二)
模块开发之React使用第三方库PropTypes属性限制(十二)前言这是一个纯配置的第三方库模块,所以我们需要掌握知识不需要太详细。能知道并拿来即用即可。 下面以使用该模块的背景展开,然后介绍使用方法,包括全部能使用的属性。掌握这几点就OK。为什么使用PropTypesReact v15.5.0官方介绍中有几句话New Deprecation WarningsThe ...原创 2018-07-03 16:36:41 · 1460 阅读 · 0 评论 -
模块开发之Node.js内置模块fs基本使用(十三)
模块开发之Node.js内置模块fs基本使用(十三)模块开发之Node.js内置模块fs基本使用(十三)背景知识学习目标引入模块同步/异常读取文件读取方式test.js语法异步读取readFile生产环境使用格式同步读取readFileSyncz生产环境格式同步/异常写入文件例子语法生产环境格式背景知识模块fs是node...原创 2018-07-04 13:23:52 · 506 阅读 · 0 评论 -
springMVC传递list对象三种情况使用方法
springMVC接收List对象以及List对象与其它对象一起传参数的使用方法,传单个key-value,或基本类型的数组最简单,稍微复杂一点的是传对象数组(`[object]`),最复杂的是对象数组与key-value一起传到后台原创 2018-07-19 18:53:34 · 38058 阅读 · 2 评论 -
React和redux,ES6等前端开发经验记录总结(都是干货,看到是你的运气)
毫不夸张,你能看到这篇文章,是你的运气,里面都是干货,在理解js的道路上容易误解的和关键点的知识。牛逼先不吹....看内容react redux react-redux redux-thunk中间件 es6特殊语法 闭包 作用域scope等知识等你吃一壶了原创 2018-08-07 19:48:22 · 1613 阅读 · 0 评论 -
牛叉的react-router-cache-route
文章目录CacheRoute遇到的问题原因 & 解决方案安装使用方法额外的生命周期CacheRoute搭配 react-router 工作的、带缓存功能的路由组件,类似于 Vue 中的 keep-alive 功能注意:目前只在 路由前进时 进行缓存React v16.3+ (兼容了 React v16.3 以下版本)React-Router v4+遇到的问题使用 Route ...转载 2018-09-25 14:33:06 · 11327 阅读 · 1 评论 -
模块开发之时间/日期组件moment.js使用(十四)
@TOC前言moment.js框架是我见过的处理日期和时间最好的工具,再也不用自己写个类处理日期格式了,放弃Date和calendar的处理吧基本使用moment与字符串想到转换一个基本的使用方式也是常用的方式是怎么把日期字符串转成moment方式,同时将moment对象显示成我们想要的方式比如const moment = require('moment')//字符串转换成mome...原创 2018-09-20 16:29:20 · 3363 阅读 · 0 评论 -
cnpmjc和sinopia搭建私有仓库
文章目录nrm基本使用安装使用npm、cnpm设置镜像服务器安装步骤克隆代码安装mysql数据库配置config/index数据库配置其它配置启动验证客户端nrm基本使用nrm是npm registry manager的缩写,是单独管理npm镜像地址的模块,注意它是管理镜像地址,列表的都是名字对应的镜像地址,可以使用nrm命令快捷切换npm镜像地址。安装npm install nrm -g...原创 2018-09-27 18:09:14 · 1152 阅读 · 1 评论 -
React 语法二:forceUpdate()、componentWillUnmount()、onMouseEnter()与onMouseLeave()
基础语法forceUpdate()语法:component.forceUpdate(callback)。该方法将强迫一个 react 组件重新渲染。我们还可以将 setInterval() 函数和 forceUpdate() 方法进行结合运用,来产生动态且平滑的效果!react 内部在调用 render() 方法时,会使用一些在 JavaScript 中不是很损耗性能的操作,所以尽情的使用...转载 2018-10-08 08:48:53 · 3352 阅读 · 0 评论 -
webpack的DefinePlugin插件实现多环境下配置切换
webpack的DefinePlugin插件实现多环境下配置切换文章目录前言实例项目实战前言在使用springboot开发后台时,可以使用spring.profies.active实现应用程序在不同的环境可能会有不同的配置,例如数据库连接、日志级别等,开发,测试,生产每个环境可能配置都不一致。其实webpack模块化开发也能实现。DefinePlugin 允许创建一个在编译时可以配置的全...原创 2018-10-25 14:20:17 · 6725 阅读 · 0 评论 -
模块开发之Redux基础入门(六)
Redux基础入门Redux基础入门核心思想引入模块核心概念Storestateactionaction creatorReact-redux框架引入框架Provider和connect2个重要概念核心思想redux是数据存储和管理的工具。 Redux核心思想是强制使用action对象去更新state数据,整个应用只能一个store,...原创 2018-06-20 13:36:17 · 523 阅读 · 0 评论 -
模块开发之ant(Ant Design of React)使用(四)
模块开发之antd(Ant Design of React)使用(四)模块开发之antd(Ant Design of React)使用(四)前言初看安装使用create-react-app脚手架安装脚本架脚本创建项目引入antd依赖按需加载组件按需加载方式一、babel-plugin-import(推荐)方式二、手动引入组件样式按需加载国际化组...原创 2018-06-19 19:41:38 · 2204 阅读 · 0 评论 -
模块开发之webpack使用(三)
模块开发之webpack使用(三)模块开发之webpack使用(三)前言使用安装webpack配置文件webpack命令配置–progress –colors开启监听模式使用package.json方式打包生成源码source-map本地服务器devServer安装安装使用:详细介绍HothostinlineporthistoryApiFal...原创 2018-06-19 14:21:11 · 690 阅读 · 0 评论 -
HTML5 data-* 自定义属性及其注意点
在HTML5中添加了data-*的方式来自定义属性,所谓data-*实际上上就是data-前缀加上自定义的属性名,命名可以用驼峰命名方式,但取值是必需全部使用小写(后面会说),使用这样的结构可以进行数据存放。使用data-*可以解决自定义属性混乱无管理的现状。1. Html绑定数据写法1.1简单单词: Click Here1.2 使用驼峰命名(需要特定注意原创 2017-06-09 14:32:47 · 15613 阅读 · 1 评论 -
你真的懂prototype吗
prototype是学习js的一个重要的概念,即原型的意思,它是属于类型的一个属性,我们知道js里任何元素都要当成对象处理,而类型和对象是不一样的,类型像java里的Class,对象类似java里new出来的对象。我们今天介绍的prototype是属于类型的。 先上个例子:测试protytype function People(sex) { this.s原创 2017-07-26 17:52:35 · 909 阅读 · 0 评论 -
图解用HTML5的popstate如何玩转浏览器历史记录
一、popstate用来做什么的? 简而言之就是HTML5新增的用来控制浏览器历史记录的api。二、过去如何操纵浏览器历史记录? window.history对象,该对象上包含有length和state的两个值,在它的proto上继承有back、forward、go等几个功能函数 在popstate之前,我们可以利用back、forward、go对history进行后退和前进操作。转载 2017-08-28 23:23:07 · 1054 阅读 · 0 评论 -
腾讯art-template4,即vue后又获一利器
腾讯art-template4,即vue后又获一利器art-template是一个简约、超快的模板引擎,官方给出的优点及特性是:1.拥有接近 JavaScript 渲染极限的的性能2.调试友好:语法、运行时错误日志精确到模板所在行;支持在模板文件上打断点(Webpack Loader)3.支持 Express、Koa、Webpack4.支持模板继承与子模板5.浏览器原创 2017-08-09 10:01:15 · 5202 阅读 · 2 评论 -
jquery弹出层插件jquery.ColorBox.js学习
第一、简介第二、上个简单的例子第三、基本使用3.1单张图片3.2组相册图片3.3 弹出效果3.4 显示html1.以独立html文件格式组织2.以内部html元素组织3.网页iframe4.直接写html元素3.5回调函数第四、属性配置1.基本属性2.Content Type3.Dimensions4.Slideshow5.位置6.元素上的回调函数...原创 2018-03-30 16:50:31 · 10591 阅读 · 0 评论 -
引入即可使用的jQuery弹出框美化插件
[TOC] xcConfirm插件是一个美化版弹框插件,弹框的标题文本可以自定义。引入js和css文件即可直接使用,使用简单。 源码,演示效果引入2个js和一个css,注意还有源码里的图片.<link rel="stylesheet" type="text/css" href="css/xcConfirm.css"/> <script src="j...原创 2018-04-02 13:50:35 · 4332 阅读 · 2 评论 -
jquery-chosen选择框插件零基础学习
jquery-chosen 选择框插件jquery-chosen 选择框插件第一、前言第二、需要入库文件第三、一个简单的例子。第四、初始化方法chosen配置第五、select组件属性第六、class样式第七、事件及抛事件第八、取值,初始化选中项,数据渲染第九、分组显示第十、多选项总结第一、前言Chosen是jquery下的一个下拉框插件。它...原创 2018-03-27 15:36:39 · 10935 阅读 · 6 评论 -
遮罩输入插件jquery.maskedinput.js学习
第一、初识遮罩输入插件是jqueryoverviewthis的一个遮罩的输入jQuery插件库。它允许用户更容易进入固定宽度输入你所希望的以一定的格式输入数据(日期,电话号码,等)。它已在Internet Explorer,Firefox,Safari,Opera和Chrome等浏览器上测试过。遮罩的定义是由一个格式由遮罩的文字和掩码定义。任何字符不在定义列表下面的被认为是遮罩文字。遮罩文字会...原创 2018-03-29 09:32:48 · 2565 阅读 · 0 评论 -
前端模块开发之npm安装、命令初体验(一)
npm学习记要npm学习记要安装nmp安装淘宝镜像npm升级安装nmpNPM是随同NodeJS一起安装的包管理工具,所以我们需要下载安装nodejs 下载地址,选择Windows Installer (.msi)版本安装。一路点next。 测试是否安装成功 在CMD命令行输入命令:npm -v有数据输出则表示安装成功安装淘宝镜像默认...原创 2018-06-14 10:54:12 · 8667 阅读 · 0 评论 -
模块开发之React入门使用(五)
引入模块渲染标签和组件渲染标签渲染React组件:React创建组件的3种方式函数式(Functional)“组件React.createClass方式简单的组件定义复杂的组件定义React.Component方式创建组件方式选择state与props使用propsstate与props区别单向数据流refs属性事件处理程序增加监听事件阻止事件冒泡事件绑定参数传递给事件处理程序防止组件渲染原创 2018-06-16 10:54:16 · 604 阅读 · 0 评论 -
模块开发之react-redux使用装饰器函数Decorator(九)
这段时间一直搞前端模块开发,使用`React`框架,配置`redux`,中间使用`react-redux`框架连接。注意到在类上添加`@`符号,甚是不解,后来问其它人,才知道这是ES6新增装饰器函数。它是一种特殊类型的声明,它可以附加到类声明、方法、参数或者属性上。装饰器由`@`符号紧接一个函数名称。原创 2018-06-29 23:46:35 · 3032 阅读 · 0 评论 -
模块开发之axios使用(二)
前端模块开发之axios使用(二)前端模块开发之axios使用(二)前言使用安装get请求方式一方式二方式三delete请求POST请求方式一方式二put语法并发其它语法配置configresponse结构体数据全局的 axios 默认值拦截器请求拦截器响应拦截器移除拦截器前言axios是个网络http...原创 2018-06-19 10:51:20 · 1692 阅读 · 0 评论 -
多页面应用画拓扑图利器-jTopo
多页面应用画拓扑图利器-jTopo文章目录多页面应用画拓扑图利器-jTopo前言入门api结点连接其它解决数据问题前言jTopo主要应用在多页面web网站上,一款完全基于HTML5 Canvas的关系、拓扑图形化界面开发工具包。优点是免费而且不依赖其它包,体积小。参考jtopo官网入门要想让官网例子源码运行,需要jquery框架,倒不是jtopo依赖jquery,只是使用了jquer...原创 2019-01-09 15:56:34 · 1777 阅读 · 0 评论