前端Joy姐-CSDN博客

转载 Vue实现后台系统权限控制

基于Vue.js 2.x系列 + Element UI 的后台系统权限控制前言：关于vue权限路由的那些事儿……项目背景:现有一个后台管理系统，共存在两种类型的人员①超级管理员（称作admin），②普通用户（称作editor）每种类型的人看到的操作栏并不一样，可以进行的操作也不尽相同，于是就需要程序处理一下各个权限问题。过程说难不难，说简单不算简单【迷茫的前期】上百度、Google，狂搜了好多关于...

2018-04-09 15:46:45 875

转载 vue项目开发过程

开发前准备项目开发规约的制定（参考腾讯前端团队规约http://alloyteam.github.io/Co...）git管理使用easymock搭建API服务官方文档学习github搜索资源页面功能组件划分确定开发工具的版本脚手架构建vue-cli构建项目基础结构项目目录结构划分移动端UI框架,使用mint-ui页面路由切换,页面间跳转实现及参数传递axios请求API封装过渡动画处理vuex使...

2018-04-09 15:45:48 388

转载 23条前端性能优化，看懂就够了！

前端性能优化是个巨大的课题，如果要面面俱到的说的话，估计三天三夜说不完。所以我们就从实际的工程应用角度出发，聊我们最常遇见的前端优化问题。1. 减少HTTP请求次数尽量合并图片、CSS、JS。比如加载一个页面，如果有5个css文件的话，那么会发出5次http请求，这样会让用户第一次访问你的页面的时候会长时间等待。而如果把这个5个文件合成一个的话，就只需要发出一次http请求，节省网络请求时间，加快...

2018-04-09 15:41:53 139

原创前端规范

http://alloyteam.github.io/CodeGuide/#naming✍Code Guide by @AlloyTeamStandards for developing flexible, durable, and sustainable HTML and CSS, and maintainable JavaScript通过分析github代码库总结出来的工程师代码书写习惯：GO...

2018-04-09 15:30:13 209

转载 js函数封装

see them...// 获取网址的get参数var GET = function(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); var r = window.location.search.substr(1).match(reg); if (r != null) r...

2018-04-02 17:14:19 349

原创移动端UI框架

如果是 Angular 那就选 Ionic (一对好 CP)如果是 Vue 那就选 Vux (基于 WeUI)如果是 jQuery 那就选 Framework7 (iOS 和 Android 双皮肤)如果是 React 那就选 ... (额，知道的补充下!)React 可以看看 TouchstoneJS 和 Reapp ，貌似都不是很完善，需要的可以详细了解下。再次更新：TouchstoneJS ...

2018-03-29 17:16:05 825

原创 RegExp表达式 Email地址验证

要做更精确地匹配，可以用[]表示范围，比如：[0-9a-zA-Z\_]可以匹配一个数字、字母或者下划线；[0-9a-zA-Z\_]+可以匹配至少由一个数字、字母或者下划线组成的字符串，比如’a100’，’0_Z’，’js2015’等等；[a-zA-Z\_\$][0-9a-zA-Z\_\$]*可以匹配由字母或下划线、开头，后接任意个由一个数字、字母或者下划线、开头，后接任意个由一个数字、字母或者下划...

2018-03-29 15:55:40 6361

转载 javaScript特殊知识点归纳

javaScript特殊知识点归纳map和set1. mapvar map = new Map([['tiger', 100],['cat',12],['dog',13]]);console.log(map.get('cat')); //获取cat值console.log(map.set('hello', 14)); //新增值console.log(map.delete('tiger'))...

2018-03-29 11:54:39 167

原创标准函数

总结一下，有这么几条规则需要遵守：不要使用new Number()、new Boolean()、new String()创建包装对象；用parseInt()或parseFloat()来转换任意类型到number；用String()来转换任意类型到string，或者直接调用某个对象的toString()方法；通常不必把任意类型转换为boolean再判断，因为可以直接写if (myVar) {…}；t...

2018-03-29 11:05:23 398

转载 web调试优化-chrome开发者工具不完全指南

web调试优化-chrome开发者工具不完全指南 chrome css html javascript 前端1.前言chrome，对于web开发者而言，都是很熟悉的一个浏览器，无论是从事的是前端，后端或者是测试！简单、快捷和功能强大使它受到了许多开发者的青睐！在浏览器排行上，chrome最多人使用，而且占了浏览器份额的半壁江山。可见其欢迎程度。作为一个前端开发者，我也是注重chrome的使用技巧...

2018-03-27 17:12:12 883

原创 js弱类型转换

如果我们继续改进这个例子，想办法把一个字符串13579先变成Array——[1, 3, 5, 7, 9]，再利用reduce()就可以写出一个把字符串转换为Number的函数。练习：不要使用JavaScript内置的parseInt()函数，利用map和reduce操作实现一个string2int()函数：'use strict';function string2int(s) { return...

2018-03-26 15:00:29 1558 1

翻译 Vue.js 自学教程 API web商城实例

vue主要功能模块渲染模板化扩展功能指令与事件的区别你看到的 v-bind 特性被称为指令——v-on 事件监听器项目结构暗示计算属性缓存 vs 方法<p>Reversed message: "{{ reversedMessage() }}"</p>// 在组件中methods: { reversedMessage: function () { return...

2018-03-26 13:43:02 1363

转载 chrome开发者工具的使用

1.如何调出开发者工具按F12调出右键审查（或快捷键Ctrl+Shift+I）调出 2.开发者工具概览Chrome开发者工具中，调试时使用最多的三个功能页面是：元素（ELements）、控制台（Console）、源代码（Sources），此外还有网络（Network）等。元素（Elements）：用于查看或修改HTML元素的属性、CSS属性、监听事件、断点等。控制台（Console）：控制台一般用...

2018-03-26 13:39:02 6186

原创安装HTML-CSS-JS Prettify插件

代码格式化：借助sublime编辑器，安装HTML-CSS-JS Prettify插件：a)在Sublime Text 3中，按下Ctrl+Shift+P调出命令面板;b)输入install 调出 Install Package 选项并回车;c)输入pretty，并在列表中选择HTML-CSS-JS Prettify后回车即可安装。d)查看本地安装的NodeJS配置环境路径（在dos命令下，输入...

2018-03-24 17:55:48 4377

原创关于sublime text3 packges control安装不了或安装完成不管用的解决办法

简单粗暴上官网https://www.sublimetext.com/3注意：不是中文版呃中文版就是巨坑然后死活解决不了packages conntrol，即使安装完也是各种不能用

2018-03-24 17:51:52 826

原创 sublime text 高亮标记法

安装完sublime text以后，一直没有高亮的方法。这感觉简直让人抓狂。我就不写多的设置了。直接说方法：1、先装package controlctrl+`打开命令行，copy进去如下代码：import urllib.request,os; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(...

2018-03-24 17:48:53 18829 3

原创关于Vue.nextTick()的正确使用

什么是Vue.nextTick()官方文档解释如下：在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM。我理解的官方文档的这句话的侧重点在最后那半句获取更新后的DOM，获取更新后的DOM言外之意就是什么操作需要用到了更新后的DOM而不能使用之前的DOM或者使用更新前的DOM或出问题，所以就衍生出了这个获取更新后的DOM的Vue方法。所以放在Vue.n...

2018-03-16 16:08:05 404

转载如何让你的.vue在sublime text 3 中变成彩色?

作者：青鲤链接：https://www.zhihu.com/question/52215834/answer/129495890来源：知乎著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。// 1.下载文件链接 GitHub - vuejs/vue-syntax-highlight: Sublime Text syntax highlighting for single-fil...

2018-03-14 16:46:41 315

翻译 js前端实现模糊查询

对于模糊查询，一般都是传关键字给后端，由后端来做。但是有时候一些轻量级的列表前端来做可以减少ajax请求，在一定程度上提高用户体验。废话不多说，直接上代码。//字符串方法indexOfvar len = list.length;var arr = [];for(var i=0;i<len;i++){ //如果字符串中不包含目标字符会返回-1 if(list[i].indexOf(...

2018-03-14 13:51:56 3430

原创 vuejs第一次配置好了，localhost:8080能显示。但是我关了电脑或者程序再次输入就不能显示

跑两个服务相当于启动两个server，就跟服务器上的nginx一样的，你关了电脑进程都关了当然就没了，每次进来开发测试之前，把npm run dev启动好。多个项目你不改端口，第二个项目端口被占用就启动不了，除非你另一个项目把端口配制成别的。...

2018-03-14 09:38:54 2271 2

转载 Vue 进阶教程之v-model详解

Vue 官网教程上关于 v-model 的讲解不是十分的详细，写这篇文章的目的就是详细的剖析一下，并介绍 Vue 2.2 v-model改进的地方，然后穿插的再说点 Vue 的小知识。在 Vue 中，有许多方法和 Angular 相似，这主要是因为 Angular 是 Vue 早期开发的灵感来源。然而，Augular 中存在许多问题，在 Vue 中已经得到解决。v-model 用在 input...

2018-03-13 16:45:42 1182

原创 v-for不能用在根元素

<div v-for="(value, key) in object"> {{ key }}: {{ value }}</div>看官网的例子才明白，原来是id和v-for不在一个层级上，我按照不在一个层级上改，果然好用了<div id="example-1"> <li v-for="(value, key) in object"&amp

2018-03-13 15:18:10 1437

原创 vue不能在根节点中使用v-for

<div v-for="(value, key) in object"> {{ key }}: {{ value }}</div>浏览器编译报错：Cannot use v-for on stateful component root element because it renders multiple elements查过很多文章,大致意思就是 v-for不能用于根...

2018-03-13 15:12:07 2093

juceli的博客