前端框架
关注
分享
扫一扫
包括bootstrap、jquery、vue、react、sass、less等前端框架知识
ღ故里᭄ꦿ࿐
愿有能力爱自己，有余力爱别人
展开
-
React从入门到项目--第八天（redux进阶）
单纯的使用上redux，会出现一个小问题，就是说redux 与 react 组件的代码耦合度太高，这时候会显得代码很乱，这时候我们可以通过一些其他的手段来降低代码的耦合度，而且代码不够简洁。reacr-redux安装npm install --save react-redux这时候我们可以引入一个react的插件库，react-redux，这是一个react的插件库，也就是说re...原创 2019-10-18 22:05:15 · 224 阅读 · 0 评论 -
React从入门到项目--第七天（redux的使用）
redux简介什么是redux呢？redux是一个独立专门用于做状态管理的 JS 库，它不是不是 react 插件库，也就是说它不仅可以用在React项目中，还可以用在其他的项目中，只是更多的用在React项目中而已。那什么是插件库呢？插件库我是这样理解的，有相应的依赖，比如说React的插件库，离开React是不能正常工作的，jQuery插件库必须依赖与jQuery。redux的作用就是...原创 2019-10-17 21:44:31 · 314 阅读 · 0 评论 -
React从入门到项目--第六天（React中Ajax的使用）
React与之前学过的jQuery不同的是，React本身只关注界面，本身并不包含相关发送ajax的代码，就像jQuery中的$.ajax()在React中是不存在的。前端应用需要通过 ajax 请求与后台进行交互，获取相应的Json数据。在React中的前端应用，在与后台进行交互的时候，需要依赖于第三方的ajax库来完成，或者自己进行原生JS的封装，不过这一点工作量就比较大了，相信也不会...原创 2019-10-16 17:03:52 · 454 阅读 · 0 评论 -
React从入门到项目--第五天（React-router的应用）
SPA应用基于React和Vue的项目都有一个共同的特点，整个项目是一个SPA应用，什么意思呢？就是说整个项目属于一个单页面应用程序，整个项目之一个完整的页面，而所见的页面的更新，只是通过路由进行的页面的局部组件替换，与真正的a链接页面跳转存在本质上的区别，它不是跳转只是更新而已。在页面转换之间，也不会向服务器发送相关的请求，所进行的数据的更新是通过额外的ajax请求去实现的。路由的理解...原创 2019-10-15 16:11:56 · 248 阅读 · 0 评论 -
React从入门到项目--第四天（React脚手架搭建项目）
什么是脚手架呢，我刚听到这个词的时候也是一脸懵逼，连忙去搜了一下，就找到了它的百度百科，介绍就是下面这样。在了解了脚手架之后，就不去吐槽这个百科了，对于项目的脚手架，其实也是一个独立的包，它可以帮助你，通过特定的命令去下载一个别人整理好的空白项目，说是空白项目也不完全正确，项目的基本结构已经搭好了，相关的配置已经完成了，只是欠缺项目内容相关代码。其实两个脚手架还真的有相似之处，盖房子就...原创 2019-10-14 22:24:09 · 315 阅读 · 0 评论 -
React从入门到项目--第三天（事件处理 & React的生命周期）
事件处理React允许开发人员为虚拟DOM添加事件处理操作，而后在render之后就会将事件绑定到真实的DOM上。而不同的是，虚拟DOM上的事件与原生的事件的写法是不一样的，如原生的onclick而在React中要使用onClick。而事件绑定的属性值为一个自定义事件函数函数名，会在render的时候自行调用。<button onClick={this.showInput}>...原创 2019-10-13 09:58:57 · 239 阅读 · 0 评论 -
React从入门到项目--第二天（React三大属性state，props，ref）
今天了解到了React的三大属性，分别是state，props还有ref。三大属性是必不可少的，而且这三大属性，和vue中的三个属性差不多，有很大的相似之处。statestate是组件对象最重要的属性, 值是对象(可以包含多个数据)，组件被称为"状态机", 通过更新组件的state来更新对应的页面显示(重新渲染组件)，就是网页包含的数据。state初始化数据state在constr...原创 2019-10-12 16:48:20 · 308 阅读 · 0 评论 -
React从入门到项目--第一天（React基本使用）
React是什么React的出现有点玄幻的，刚开始是在Facebook 的内部项目中使用的，因为该公司对市场上所有 JavaScript MVC 框架，都不满意，就决定自己写一套，后来发现很好用，结果就开源了。React 是一个声明式，高效且灵活的用于构建用户界面的 JavaScript 库。使用 React 可以将一些简短、独立的代码片段组合成复杂的 UI 界面。React是基于组件进行...原创 2019-10-11 17:20:40 · 370 阅读 · 0 评论 -
NodeJs+Vue+MongoDB后台管理系统模板（6）Vue的跨域配置
在进行前后端交互的过程中，遇到的第一个问题肯定就是跨域的问题了，在vue中这时候需要去更改一下配置的信息，打开根目录下的config下的index.js文件。这时候需要去更改dev下边proxyTable的信息，具体的都不多说了，你可以直接复制粘贴走，不过要记得把target的信息改一下，因为那是我本地服务所在地。proxyTable: { '/apis': { ...原创 2019-09-28 09:07:01 · 618 阅读 · 0 评论 -
NodeJs+Vue+MongoDB后台管理系统模板（5）数据生成Excel并导出
将数据生成Excel并导出是后台管理系统常备的功能，但是之前还没有尝试过通过NodeJs去实现，这一次在网上去搜索了具体的实现方法，从中了解到了一个node-xlsx的node模块，在npm的官网上了解了相关的使用方法。const xlsx = require('node-xlsx');在具体操作的时候，生成excel时需要的数据是数组值类型数组，[[1,2,3],[1,2,3],[1,...原创 2019-09-28 08:51:47 · 640 阅读 · 0 评论 -
NodeJs+Vue+MongoDB后台管理系统模板（1）封装MongoDB模块
封装相关的MongoDB模块首先少不了的就是安装相关组件:npm install mongodb@2.2.36 --save引入mongodb的MongoClient，并定义运行的MongoDB的数据位置及端口的相关信息，最后暴露相关的方法，剩下的就是封装相关增删改查的方法了，需要注意的是我因为当初学习的时候用的是较老的版本，所以直接安装的话，我的代码可能会报错，需要安装指定版本的Mo...原创 2019-09-27 20:18:45 · 826 阅读 · 0 评论 -
NodeJs+Vue+MongoDB后台管理系统模板（2）vue实现分页
众所周知的是，所有的后台管理系统都离不开分页，而传统的分页实现，更多的是同后端的进行交互，传递页码并返回当前页所包含的数据，最终进行展示。这种做法存在的弊端就是用户在进行页码切换的时候，后耗费大量的时间，同样也会增加后端工程师的压力，这一次我们通过vue实现分页功能。首先是数据问题，在node里直接查询所有的用户返回给前台。// 获取全部用户信息router.get('/userLis...原创 2019-09-27 21:09:15 · 881 阅读 · 0 评论 -
NodeJs+Vue+MongoDB后台管理系统模板（3）调用Chrome接口数据打印
有的时候后台管理系统需要实现数据的打印功能，这时候就需要去调用Chrome的接口进行数据的打印，window.print()会打印整个HTML页面，其实不是我们需要结果，这时候就需要进行一些处理，比如我得只需要去打印表格内的内容，这时候我选择封装一个打印的函数。print(){ this.showOperation = false; setTimeout(()=>{ ...原创 2019-09-27 21:33:14 · 500 阅读 · 1 评论 -
NodeJs+Vue+MongoDB后台管理系统模板（4）添加数据之图片上传
在进行数据的管理过程中，图片的上传是必不可少的，在这里我的是用户头像为例，在图片上传的过程中，NodeJs我用到了一个叫做multer的模块，他有一个要求就是上传的时候必须通过multipart/form-data的方式进行上传，简单地说就是提交一个form表单，或者提交一个FormData，所以在这一过程中，我还用到了body-parser，需要注意的是，multer和body-parser不仅...原创 2019-09-28 08:20:51 · 903 阅读 · 0 评论 -
Vue学习之vuex（vue状态管理）
如果学过vue.js的话，大家一定知道在vue中各个组件之间传值的痛苦，在vue中我们可以使用vuex来保存我们需要管理的状态值，值一旦被修改，所有引用该值的地方就会自动更新，下面就简单的介绍一下vuex是如何修改状态值的：新建一个项目，项目创建后，然后安装vuex，使用命令：npm install vuex --save（安装vuex保存到本地）。这个时候需要在src目录下新建一个目录sto...原创 2019-08-19 09:01:22 · 293 阅读 · 0 评论 -
Vue封装ajax请求的函数（axios）
使用过Vue的都知道，在vue的项目中，实现前后端交互是通过resource或者axios，而相比之中axios是使用比较多的一种。在学习的过程中，学习了解了axios的使用方法之后，进而学习了如何把ajax封装成一个方法，然后在使用中，直接调用相应的函数就方便的多了。axios的安装cnpm install axios --saveaxios基本使用import axi...原创 2019-08-17 08:53:32 · 2213 阅读 · 1 评论 -
Ajax文件上传功能de实现
在进行文件上传的时候，我们往往会使用表单提交的方式：<form action='....'> <input type='file' name='file' /> <input type='submit' value='上传'></form>但是给表单提交添加回调函数比较困难，所以在这一次提交时，我使用了Ajax进行提交，在...原创 2019-01-24 11:16:55 · 659 阅读 · 0 评论