高阶
先来个小漩涡
话不多说,先来个小漩涡
展开
-
Promise异步调用两个函数,前一个函数结束后执行另一个函数
Promise异步调用两个函数,前一个函数结束后执行另一个函数/*保存*/ onSave(content){ /*异步压缩执行*/ let self=this Promise.all([this.ZMFile(1), this.FMFile(2)]).then(function (results) { ...原创 2019-12-06 15:06:02 · 1406 阅读 · 0 评论 -
上传图片文件----vue----elementUi组件el-upload
使用场景**1.后台系统上传图片逻辑** *首先选择图片监听确认事件,展示赋值页面预览图片路径赋值,再继续验证图片格式大小,最后提交到后台接口formData形式file文件;【再传递后清空页面所有参数~可无】*DOM<!--上传--> <el-upload class="avatar-uploader" ref="uplo...原创 2019-12-06 14:23:12 · 382 阅读 · 0 评论 -
浏览器新开窗口打开页面 VUE
1.引用场景:需要查看多个详情页面对比时使用新开窗口,打开多个页面进行数据比较userOrderList(){ let routeData = this.$router.resolve({ // path:'/PatientInfo_index', name: "OrderNavFullOrder", query: {a...原创 2019-11-12 09:36:01 · 1677 阅读 · 0 评论 -
vue移动端适配rem
https://www.cnblogs.com/xieyong25/p/9596497.html转载 2019-11-01 11:56:16 · 236 阅读 · 0 评论 -
http以及https适配网址接口 后台管理系统
1.应用场景在开发过程中需要http、https2.实现在公共config文件var agreement = location.protocol;//获取http或者https // var baseUrl=agreement+'//*******/';//线上var baseUrl='/api/';//本地// var baseUrl=agreement+"//localhost...原创 2019-10-25 14:09:41 · 497 阅读 · 0 评论 -
vue实现甘特图,动态展示数据
场景:1.在开发一个后台系统时,遇到一个甘特图的需求2.通过特定的数据结构和vue的循环判断加上table原生表格的合并行列实现需求效果<template> <div class="hello"> <!--Echarts图表盒子--> <div id="myChart" :style="{width: '1633px', h...原创 2019-10-14 11:09:20 · 2851 阅读 · 0 评论 -
【Vue】 keep_alive缓存部分页面返回不刷新
1.缓存页面使用场景(点击跳转路由到详情页面,后返回入口页希望数据保持)2.使用keep-alive3.首先在app.vue文件中修改<template> <div id="app"> <keep-alive> <router-view v-if="$route.meta.keepAlive"></router-v...原创 2019-09-10 15:01:23 · 471 阅读 · 1 评论 -
搭建Vue脚手架(vue-cli)并创建一个项目【看这一篇就够了】【个人记录,以便后期参考】
1、 安装nodejs环境2、安装vue-cli有npm和cnpm两种方式,网上都说cnpm好些,所以我也用的cnpm安装,首先利用淘宝镜像安装cnpmnpm inst...原创 2019-09-11 11:09:30 · 684 阅读 · 0 评论 -
js调用浏览器打印事件Print【vue中使用】
1.常见的打印方法jsPrint()2.打印浏览器局部页面3.上代码 PrintClick() { // window.print();//打印全部 var oldHtml = document.body.innerHTML;//将body内容先行存储 var printbox = document.getElementById("FullOr...原创 2019-09-16 16:26:46 · 5015 阅读 · 1 评论 -
vue过滤器使用 filter
1.filter的使用场景,一般为当后端返回数据为判断显示某个内容时,原来通常使用v-if现在改用filter便于管理1.创建filter文件import Vue from 'vue';/*订单页面详情页面,状态栏*/Vue.filter('settleAccountsType',(val)=>{ if(val==4){ return `订单已取消!` }el...原创 2019-09-16 16:30:45 · 771 阅读 · 0 评论 -
Template模板引擎实现用户数据的渲染 【jquery】
1.原生js dom 写入界面需循环数据是使用template模板引擎2.mock为前端模拟数据,可以看看我以前写的mock使用方法3.直接来吧<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style typ...原创 2019-09-19 10:31:03 · 876 阅读 · 0 评论 -
elementUI table表格合并列相同行:span-method="objectSpanMethod"
1.应用场景:在使用element表格table时一个需求是要相同列的相同厂家合并为一格显示2.效果3.代码实现【引入elementUI就不多说】4.上代码首先需要在eltable标签中加入绑定函数 :span-method=“objectSpanMethod”<el-table :span-method="objectSpanMethod" ...原创 2019-09-26 14:17:19 · 5112 阅读 · 3 评论 -
includes检查数组中是否含有某个元素
let arr=[1,2,"wo"]arr.includes("wo")输出:true原创 2019-08-21 11:15:16 · 748 阅读 · 0 评论 -
vuex刷新状态数据丢失,解决方法
1.原创 2019-08-21 11:03:33 · 244 阅读 · 0 评论 -
过渡属性 transition:all 1s linear 0s;
过渡属性的作用就是体现元素默认样式与最终样式变化的过程。代码格式:transition:all 1s linear 0s;注:第一个参数的作用是设置元素的哪些属性过渡,all表示全部过渡,width代表属性宽度过渡,其他不过渡,其他属性也一样。的哥属性设置过渡需要的时长,单位s不能省略。第三个属性设置过渡延迟多少秒执行,单位s不能省略。hover 设置鼠标移到某一元素时状态。tran...原创 2019-08-21 11:00:51 · 11417 阅读 · 0 评论 -
Promise异步调用两个函数,前一个函数结束后执行另一个函数
1.话不多说,先来个小漩涡2.上代码text1(){ return new Promise((resolve, reject) => { setTimeout(function () { resolve(console.log('1111111111'));//返回写函数里面你要执行的内容 },3000) })},text2(){ ...原创 2019-06-12 15:31:21 · 8424 阅读 · 1 评论 -
vue 绑定img路径
1.话不多说,先来个小漩涡2.import imgs from “…/images/icon_nav_button.png”;data里面aaaaaaa:imgs原创 2019-06-12 15:35:46 · 706 阅读 · 1 评论 -
vue 动态路由添加动态类名样式,并适用于v-for循环导航
1.话不多说,先来个小漩涡<template> <div class="boxDiv"> <van-nav-bar title="监护图表" left-text="返回" left-arrow fixed @click-left="onClickLeft"/> <PatientBase/> <div style="...原创 2019-06-12 15:43:08 · 2039 阅读 · 0 评论 -
new Set对列表去重
原创 2019-06-13 10:55:12 · 1365 阅读 · 0 评论 -
Javascript高阶 奇淫巧技
向下取整最快方式向下取整有很多方法, Math.floor, parseInt都可以, 不过两个非(~)运算符来取整是最方便的, 而且逻辑运算很快.还可以用~~再加1来向上取整.~~3.14> 3~~Math.PI> 3~~Math.E> 2~~12.98> 12转数值类型最快方式字符串转数字类型也有很多方式, parseFloat, Nu...转载 2019-06-13 11:05:42 · 231 阅读 · 0 评论 -
vue-calendar日历组件使用总结
1.话不多说,先来个小漩涡2.上效果3.上代码<!--您的查房打卡--><template> <div class="content"> <!--标题--> <p class="titleP"> 您的查房打卡情况 <!--<span class="colorblue" @c...原创 2019-06-13 13:57:25 · 40678 阅读 · 8 评论 -
element Rate评分组件在可以修改关注度的前提下修改未选中的icon背景颜色
1.话不多说,先来个小漩涡2.上代码<el-rate style=“display: inline-block;”v-model=“ILevelnumber”void-icon-class="el-icon-star-on":max=3@change=“changeclick(ILevelnumber,userInfoData.Id)”>3.标粗为重点,官方的不生...原创 2019-06-11 14:48:56 · 3014 阅读 · 0 评论 -
vue 实现登录键盘enter事件
1.话不多说,先来个小漩涡2.上代码<el-button type=“primary” v-on:keyup.13.native=“submit” @click=“submitForm(‘ruleForm2’)” size=“medium”>登 录3.created(){var _this = this;document.onkeydown = function...原创 2019-06-11 17:10:46 · 4749 阅读 · 3 评论 -
gulp打包工具使用总结
环境安装: 1、gulp的安装 首先确保你已经正确安装了nodejs环境。然后以全局方式安装gulp: npm install -g gulp 全局安装gulp后,还需要在每个要使用gulp的项目中都单独安装一次。把目录切换到你的项目文件夹中,然后在命令行中执行: npm install gulp npm init 如果想在安装的时候把gulp写...原创 2019-08-21 10:55:57 · 310 阅读 · 0 评论 -
阻止事件冒泡委托,点击子元素不触发父元素点击事件
1.小问题总结,如标题字面意思2.html代码我就不列举,父子元素想必都清楚$("ul[data-type='cityPick']").on('click',function(){ alert("父元素ul被点击"); }); $("ul[data-type='cityPick']").on('click','li',function(e){ e.stopPropagation();/...原创 2019-08-21 10:58:38 · 935 阅读 · 0 评论 -
前端vue实现echarts+甘特图全动态显示数据,提供翻页功能,提供数据更新功能,根据数据更新横线,并提供hover效果,展示当前列描述信息
效果 <div id="myChart" :style="{width: '1633px', height: '300px'}"></div> <!--表格--> <div style="margin-left: 3px;width: 1633px;"> <table style="border: 1px solid bl...原创 2019-04-02 15:03:10 · 3076 阅读 · 1 评论