南南合作-优快云博客

原创 layui中权限树authtree中的checkbox设置禁止勾选

$('#LAY-auth-tree-index input[type="checkbox"]').prop('disabled',true)用disabled这个属性在此起不了作用，但是需求提出要有禁止功能，于是想出给div添加pointer-events：none禁止点击属性$('#LAY-auth-tree-index').css('pointer-events','none')虽...

2019-07-23 17:05:29 3045 1

原创 Vue中路由全局守卫

//注册全局守卫，作用是路由跳转前对路由进行判断，防止未登陆的用户跳转到其他页面去router.beforeEach((to,from,next)=>{ let token=localStorage.getItem('mytoken') //如果已经登录就不干涉 if(token){ next() }else{ if(to.p...

2019-07-02 12:03:13 421

原创 Vue中登录状态保存

HTTP请求是无状态的cookie 1. 保存在客户端 2. 数据量小（很多站点对cookie的大小和数量进行了限制） 3. 不安全（别人可以分析存放在本地的cookie并进行cookie欺骗，也可能被拦截）session 1. 保存在服务器端 2. 安全 3. session可以依赖cookie，也可以不依赖使用url 4. 访问量增多，占用服务器资源，如果服务器挂...

2019-07-02 12:01:51 4222

原创 vue-cli脚手架工具的使用

全局安装vue-cli npm install vue-cli -gvue init webpack jxc-weekly运行项目 npm run dev项目上线 npm run build

2019-06-26 20:06:42 180

原创 Vue中监听路由参数变化

var productType = Vue.component('indexB', { data() { return { allProduct: '' } }, // 在h...

2019-06-26 09:56:22 1130

原创 Vue中的路由使用及添加参数

在一个系统中会由很多页面组成，在Vue开发中这些页面通常使用的是Vue中的组件来实现的，那么当在一个页面要跳转到另外一个页面的时候是通过改变url路径来实现的，那么这个时候Vue需要知道当前url对应的是哪个组件页面<!DOCTYPE html><html lang="en"><head> <title></title&gt...

2019-06-26 09:41:40 8696 1

原创 Vue中局部过滤器和局部自定义指令

不管是局部自定义指令还是局部过滤器都只能在当前组件内使用，脱离当前组件无效// 全局自定义指令可以在任何组件中使用 Vue.directive('mycolor', { inserted(el, binding) { console.log(binding); // binding.value可以获取传入自定...

2019-06-26 08:45:07 433

原创 Vue中的监听watch及深度监听

（watch）用来观察和响应 Vue 实例上的数据变动 <div id="app"> <input type="text" v-model="firstName"> <input type="text" v-model="lastName"> <!-- 这样写不好，这样是模板逻辑变得厚重，不易维护 --...

2019-06-25 20:09:15 1069

原创 Vue中计算属性computed

计算属性出现的目的是解决模板中放入过多的逻辑会让模板过重且难以维护的问题；计算属性是基于它们的依赖进行缓存的 <div id="app"> <input type="text" v-model="firstName"> <input type="text" v-model="lastName"&g...

2019-06-25 20:00:12 193

原创 yarn使用说明

yarn 作用和 npm 完全一样，但是从体验上来说，yarn 更胜一筹；而且， RN 中只能使用 yarn 装包，千万不要用 cnpm 或 npm;yarn init -y表示快速初始化一个包管理配置文件，如果在项目中，不初始化就装包，也会出现安装到用户目录下的问题；装包运行 yarn add jquery，这里不需要指定 --save 或 -S ，因为 yarn 默认就是...

2019-03-07 20:12:45 653

原创 ReactNative快速打包

1.安装完yarn后设置镜像源：1. yarn config set registry https://registry.npm.taobao.org --global2. yarn config set disturl https://npm.taobao.org/dist --global2.npm install -g react-native-cli3.运行re...

2019-03-07 19:52:24 472

1.安装最新版本的java jdk1. 修改环境变量，新增JAVA_HOME的系统环境变量，值为C:\Program Files (x86)\Java\jdk1.8.0_112，也就是安装JDK的根目录2. 修改系统环境变量Path，在Path之后新增;%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin3. 新建系统环境变量CLASSPATH，值为.;%JAVA_HOME...

2019-03-07 18:24:04 164

原创设备独立像素比例值与物理像素

获取独立像素与物理像素比例值 window.devicePixelRatio获取设备的物理像素屏幕的宽度：window.screen.width 屏幕的高度：window.screen.height

2019-03-05 20:43:11 347

原创 JS实现轮播图

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">

2019-03-01 15:58:25 190 1

原创 JS实现动态创建表格

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0">

2019-02-25 15:39:10 511 1

原创 tab栏切换

<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> * { margin: 0;

2019-02-25 11:38:42 148

原创隐藏显示二维码

&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head lang="en"&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;&lt;/title&gt;

2019-02-25 11:17:03 1306

原创获取url中的参数

var url = 'www.baidu.com/s?ie=utf-8&f=3&rsv_bp=0&rsv_idx=1&tn=baidu&wd=%E5%93%88%E5%93%88&rsv_pq=84a1b13c0000e273&rsv_t=1705bXNJfVLieD09bG2VesPjLfEPwDtRrAJEBngVIjcFGHqSq8%2...

2019-02-22 16:50:22 259

原创计算时间差，返回相差的天、时、分、秒

function getInterval(start, end) { //两个日期相差的毫秒数 var interval = end - start; //定义相差的天数、小时数、分钟数、秒数 var day, hour, minute, second; interval /=...

2019-02-18 20:36:49 1225

原创格式化日期

格式化日期对象，返回 yyyy-MM-dd HH:mm:ss 的形式function formatDate(date) { //判断参数data是否是日期对象 if (!(date instanceof Date)) { console.error('date不是日期对象') r...

2019-02-18 19:37:24 282

原创 Html页面跳转传参，中文乱码解决

encodeURL编码 decodeURL解码第一个页面var searchUrl=encodeURI('index2.html?name=' + name + '&danwei=' + danwei)window.location.href = searchUrl;第二个页面var url = decodeURI(window.location.href.split('?...

2019-01-16 10:58:59 4520

原创组件的生命周期

生命周期分为八个阶段:1.beforeCreate（创建前)2.created（创建后）,3.beforeMount(载入前),4.mounted（载入后）,5.beforeUpdate（更新前）,6.updated（更新后）,7.beforeDestroy（销毁前）,8.destroyed（销毁后）<!DOCTYPE html><html lang="en...

2019-01-04 19:10:54 133

原创利用component组件和is属性实现动态组件

<!DOCTYPE html><html lang="en"><head> <title></title> <meta charset="UTF-8"> <meta name="viewport" content="width=d

2019-01-04 18:32:11 5773

原创兄弟组件间的传值

<!DOCTYPE html><html lang="en"><head> <title></title> <meta charset="UTF-8"> <meta name="viewport" content="width=de

2019-01-04 18:20:31 1035

原创父子组件间的传值

父组件向子组件传值 (props)<body> <div id="app"> <father></father> </div> <script> //创建一个父组件 Vue.component('father', { te

2019-01-04 14:35:51 730

原创父子组件创建

<body> <div id="app"> <father></father> </div> <script> // 创建一个fahter组件 Vue.component('father', { template: `&

2019-01-04 11:29:38 423

原创组件中使用指令和事件

错误写法data: { msg: 'hello world' }data必须是一个函数<!DOCTYPE html><html lang="en"><head> <title></title> <meta charset="UTF-8"> &lt

2019-01-04 10:59:15 266

原创 vue中组件的创建

三种创建方法：注意：1.模板template中只能有一个根节点2.组件的名字，如果采用驼峰命名的话，如myName,那么在使用的时候只能只用my-name1.vue.extend结合vue.component创建&lt;body&gt; &lt;div id="app"&gt; &lt;index-a&gt;&lt;/inde

2019-01-03 19:59:45 434

原创 Vue中使用过滤器filter

1. 定义方式可以在 new Vue({filters：{}})中的filters中注册一个私有过滤器 2. 定义格式： new Vue({ el:'#app', filters:{ '过滤器名称':function(管道符号|左边对象的值,参数1,参数2,....) { ...

2018-12-19 13:41:24 460

原创在Vue中输入框自动获取焦点的三种方式

原生JS操作DOM使用mounted钩子函数，它表示页面一加载进来就执行函数里面的内容（和window.onload类似）//html部分编号:<input type="text" v-model='newId' id='inputId'>//vue对象var vm = new Vue({ el: '#app', data: { newId...

2018-12-19 13:22:20 35060 3

原创移动端加载loading动画

图片css部分#tipDiv { display: none; position: absolute; left: 39%; top: 230px; z-index: 9999; background: #d9d9d9; padding: 10px; border-radius: 5px; } #tipInfo { mar...

2018-12-07 15:28:51 5371

原创 vue中常用的系统指令

插值表达式数据绑定最常见的形式，其中最常见的是使用插值表达式，写法是{{}} 中写表达式<body> <div id="app"> <p>{{name}}</p> <p>{{age}}</p> </div> &a

2018-11-29 20:43:56 393

原创什么是MVVM

M :Model(数据模型)V :View（视图模型）VM:ViewModel(一个同步View和Model的对象)用jquery库开发存在缺点：1. 业务与视图代码糅合一起，会相互影响2. 大量操作DOM，操作冗余，难以维护3. 大量的DOM操作使得页面渲染性能降低，加载速度变慢，影响用户体验4. 当Model频繁变化时，开发者需要手动更新view，用户操作改变model时，...

2018-11-29 11:26:12 200

原创 Vue项目前期准备--插件下载与IDE的配置

插件下载需要下载浏览器插件 Vue.js devtools下载完成后，如果网站是用Vue框架，那么右上角的V会高亮显示，f12打开控制器，也可以看到我用的IDE是Vscode，需要下载以下插件：自动补全标签插件 Auto Close Tag浏览器自动打开，修改文件，浏览器自动刷新插件 Live Server路径自动补全插件 Path Intellisensevue语法高...

2018-11-29 09:57:06 712

原创 IE低版本不识别H5标签的兼容处理

直接引用一个 html5shiv.min.js 的js文件包//<!--[if lt IE 9]>版本小于9//<!--[if lte IE 9]>版本小于等于9

2018-11-28 18:41:38 485

原创自定义动画

html<img src="images/t1wsqsfgnaxxxmjxp6-470-50.png" class="fly updown" alt="">css .fly { position: absolute; right: 20%; top: 10% }js .updown {/* 类似于 js 调用函数 */ ani...

2018-11-28 10:00:52 114

原创 fullpage 全屏插件使用

github 官网 https://github.com/alvarotrigo/fullPage.js中文演示地址 http://www.dowebok.com/demo/2014/77/fullPage.js 是一个基于 jQuery 的插件，它能够很方便、很轻松的制作出全屏网站，主要功能有：支持鼠标滚动支持前进后退和键盘控制...

2018-11-27 20:37:27 153

原创 axios.post发送表单数据传给后台是空对象的问题解决

此处用对象形式传数据，而官方文档中说明了：默认情况下，会把数据对象转成JSON格式传给服务端，传的数据格式应该是字符串格式 name=zs&gender=男官方文档：https://www.npmjs.com/package/axios所以把对象形式改成 $(’#form’).serialize(),在浏览器端调用serialize()方法序列化再提交 axios.pos...

2018-11-26 21:52:52 4718

原创 JSONP 和 CORS 的区别

JSONP的原理：动态创建script标签JSONP发送的不是Ajax请求不支持 Post 请求；CORS:跨域资源共享.本质，就是使用 XHR 对象，发送Ajax请求，来进行跨域的资源共享CORS 发送的是真正的Ajax请求CORS 支持Ajax的跨域如果要启用 CORS 跨域资源共享，关键在于服务器端，只要服务器支持CORS跨域资源共享，则浏览器肯定能够正常访问这...

2018-11-23 11:45:09 2062

原创 express中获取参数的几种形式

从URL地址中获取查询参数通过 URL 地址栏中，? 形式传递的参数，可以直接通过 req.query 来获取const express = require('express')const server = express()server.get('/index.html', (req, res) => { console.log(req.query)//结果是{ id...

2018-11-23 10:29:15 638

js仿百度弹出登录窗口并拖拽

空空如也