- 博客(39)
- 收藏
- 关注
RSS订阅
原创 [vue] 混入+替换对应文字实现简繁切换
原理很明显，就是替换页面上的字1.在工具文件夹导入jsimport { setToken, getToken } from './zhCook' // 封装cookie存储// 网页简繁体转换// 本js用于客户在网站页面选择繁体中文或简体中文显示，默认是正常显示，即简繁体同时显示// 在用户第一次访问网页时,会自动检测客户端语言进行操作并提示.此功能可关闭// 本程序只在UTF8编码下测试过，不保证其他编码有效// -------------- 以下参数大部分可以更改 -------
2021-08-24 11:23:32
1261
原创 vue element-ui 照片墙的添加与修改
1.效果图2.标签中 :file-list=“fileList” 渲染已经添加进去在的照片 <el-form-item label="套餐图片"> <div class="img_type" style="color: red">(支持jpg、png、jpeg格式,小...
2019-12-11 17:05:52
2967
原创 vue菜单点击刷新页面
通过改变router-view中的key来达到刷新组件的目的 <router-view v-show="!showFrame" ref="routerView" :key="key"></router-view>computed: { key() { return this.$route.name !== undefined ?...
2019-12-11 16:27:48
1570
原创 Vue Element-UI Table单击某个一行改变其背景颜色
1、先开启element的高亮选项开启 highlight-current-row <el-table id="exprotTable" border stripe highlight-current-row v-loading="loading" ...
2019-12-11 16:22:25
4693
原创 获取URL链接上的参数方法
例：http://61.185.20.130:10000/yanglaoyuandaping/index.html?organizationCode=JG191203102813448方法： function getParam(paramName) { paramValue = "", isFound = !1; if (this.location.search.indexOf("?") == 0 && this.location.search.in
2021-08-25 10:16:57
280
原创 JQ面向对象封装横向轮播图demo
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> * { margin: 0; padding: 0; } #banner{ width: 980p.
2021-08-24 11:30:59
251
原创 vue 强制更新数据 this.$forceUpdate()
使用Vue开发时，在函数中改变了页面中的某个值，在函数中查看是修改成功了，但在页面中没有及时刷新改变后的值；赋值玩以后，执行下面这个方法 强制刷新数据。this.$forceUpdate()
2021-08-17 15:43:33
1656
原创 vue+elementui table表格点击单元格单元格改变背景色
<el-table:data="tableData"border@cell-click="cellclick":cell-style="tableCellStyle"></el-table>data(){row:'',column:''}cellclick (row, column, cell, event) {this.row = rowthis.column = column},tableCellStyle (row, rowIndex, colu
2021-08-17 15:37:49
859
原创 Vue 祖孙方法调用 祖父级方法在孙级调用 祖孙传参
有需求子元素的子元素（孙子级别的元素）获取到的值要传递给祖父级祖父级代码：新增方法：provide ( ) 与生命周期同级 data() { ……},// 与生命周期同级provide() { return { //子组件调用的名字：对应的方法（当前页面，祖父级元素的方法） openList: this.openList };},mounted() { ……},methods: { openList(type) { // 逻辑代码 console
2021-08-06 18:24:58
963
原创 css 解析空格style=“white-space: pre-wrap；，Vue中解析＜/br＞ v-html
<div style="white-space: pre-wrap;" v-html="order.callerContent"> </div>
2021-07-27 17:03:22
814
原创 关闭谷歌同源策略
1、复制一个谷歌快捷2.改变属性中的目标参数“C:\Program Files (x86)\Google\Chrome\Application\chrome.exe” --allow-file-access-from-files --user-data-dir=“C:\MyChromeUserData” --disable-web-security
2021-07-26 09:15:52
357
原创 vue element-ui 照片墙的添加与修改（Vue公共插件可直接使用哦）
1.添加公共 photoWall.vue（我自己起的Vue名称，你们可自己取）我这个公共插件引入到components文件夹下，你们可选择自行引入，在使用的时候注意文件夹路径即可photoWall.vue内容（可直接复制使用）<template> <div id="photoWall"> <el-upload ref="upload" :action="uploadBaseUrl"
2021-06-30 15:58:12
1976
1
原创 echars上的点击事件
bljdmainStat(seriresData){//办理进度 var chartDom = document.getElementById('bljdmainStat'); var myChart = echarts.init(chartDom); var option; option = { color:['#0054FF','#E3C104','#07B862','#.
2021-06-30 15:24:39
127
原创 echarts自动选中高亮
var vm = new Vue({ el: "#index", data(){ return { isSet1:true, myChartIndex:-1, startCharts:null, } }, mounted() { this.init(); }, methods: { init() {
2021-06-30 15:20:51
844
原创 echars 功能说明
1.设置一个或者多个y轴对齐方法代码function _getMaxValue(arr) { const max = Math.max(...arr); // 这样处理是为了不让最大值刚好到坐标轴最顶部 return Math.ceil(max / 9.5) * 10;}function _getMinValue(arr) { const min = Math.min(...arr); // 这样处理是为了不让最大值刚好到坐标轴最底部 return M
2021-06-30 15:12:44
304
原创 常用插件地址
1.echarts3D图形https://www.makeapie.com/explore.html#sort=rank~timeframe=all~author=all
2021-01-21 12:00:37
298
1
原创 vue 使用xlsx导出功能(及其选择导出,条件导出,部分字段导出)
1.下载xlsx插件npm install --save xlsx2.main.js中使用import XLSX from 'xlsx'Vue.prototype.XLSX = XLSX```3.vue页面中使用 <el-button type="success" @click="exportExcel" size="small" icon="el-icon-upload2">导出</el-button> exportExcel() {
2020-11-17 16:34:39
9324
9
原创 vue 中 lodash的使用
lodash官网连接main.js的使用import _ from "lodash"Vue.prototype._=_;vue文件中的使用let me = this; this.stamp.nationId = _.find(me.ethnicData, o => o.value == me.modify.nationId).label;
2020-07-08 15:15:02
1663
原创 “网站变灰”的代码实现
网站变灰为了表示哀悼，当天很多网站把主页和内容都变成了灰色，比如百度、B 站、爱奇艺、优快云 等等。优快云&&爱奇艺&&百度等实现:html.gray {-webkit-filter: grayscale(.95);}html {-webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale
2020-06-09 18:09:21
250
原创 vue中鼠标单击事件与双击事件 的绑定 以及修饰符
一.点击:双击:鼠标事件给某个元素添加点击事件时，在click属性前加“v-on:或@”，属性值为点击事件方法。相应的点击事件方法仍然存放于methods当中。双击事件，将click改为dblclick即可。鼠标事件：方法与点击事件一样。二.事件修饰符(once:prev:stop)4. once：事件仅生效一次，eg：与点击事件配合使用，@click.once。只可以点击一次。5...
2020-05-06 09:41:17
1854
原创 vue element-ui el-table表格中鼠标单击事件与双击事件的绑定
<template> <el-table :data="tableData" style="width: 100%" @row-click="handleclick" @row-dblclick="handledbClick"> <el-table-column prop="name" label="姓名"> </el-table-column...
2020-05-06 09:33:14
5781
原创 css 滚动条样式-----自定义
/自定义滚动条样式/ .bottomGeneralize1为标签名称.bottomGeneralize1::-webkit-scrollbar {width: 5px;}.bottomGeneralize1::-webkit-scrollbar-track {background-color:rgba(7,166,255,0.38);-webkit-border-radius: 2e...
2020-04-29 09:56:50
154
原创 vue 项目部署 在nginx上
具体的下载请参考我的这篇博客点击跳转npm run build通过上面命令后打包好的静态资源将输出到dist目录中。如图所示：修改nginx配置文件，配置文件为conf下的nginx.conf,修改nginx.conf中的server配置片段server { server { listen 9999; #默认端口是80，如果端口没被占用...
2020-04-24 15:32:36
275
原创 前端 使用nginx
1.>去官网下载安装包nginx官网链接一般前端使用下载标准版就可以如下：2>解压以后的文档为3>更改配置123 一般只更改浏览器端口## 标题3>使用将html原来的文件删除，粘贴在你需要运行的文件在文件夹内空白处点击鼠标，然后按住shift键在点击鼠标右键 出现如下：点击打开窗口：输入命令：**开启命令：start nginx...
2020-04-24 15:07:13
826
原创 原生JS，html,css 一个页面使用多个swiper轮播图，以及swiper轮播图单轮播，多重轮播 源码demo，以及叠加显示隐藏切换问题，多轮播嵌套鼠标悬停等问题，循环播放无停顿设置
如果你想使用轮播图请先去swiper官网查看实例看是否有你需要的swiper官网由于下面内容过长先给大家讲几种swiperd 功能（1）swiper循环播放且无停顿 功能css#thumbs5 .swiper-wrapper,{ -webkit-transition-timing-function: linear !important; /*之前是ease-out*/ -m...
2020-04-23 18:26:11
1327
原创 vue elemenet-ui table表格循环创建时改变表格内的字体样式
1，效果图：1>绑定属性 “ :cell-style=“cellStyle” ” <el-table id="exprotTable" border stripe v-loading="loading" :max-height="tableHeight"...
2020-04-02 11:31:40
785
原创 vue 前端 md5 加密
1.md5 加密用户注册时将加密后的密码发送给后端存储当登陆的时候,再将加密后的密码和数据库中加密的密码相匹配。此加密无须解密2.md5的在vue中的用法1>安装。npm install js-md5 -D2>使用。（1）项目中引入md5模块。import md5 from “js-md5” 使用：import md5 from “js-md5”（2）在m...
2020-01-07 15:39:57
571
原创 vue 3.0 scss 更换主题
这是一个比较笨的方法，有几个主题写几套样式，优点使用起来比较简单 ，缺点不高级维护起来比较麻烦基于scss1.首先先在你的文件夹下新建文件夹如下：theme.scss//.el-header,.el-footer 的背景色$background-main-color1:#3b69d6; //背景色$background-main-color2:#209F5C; //背景色...
2020-01-06 17:03:42
1118
原创 vue3.0中console.log()会报错
window.console.log(this.list);这个错误是Vuejs - 使用ESLint检查代码质量是进行提示的,所以修改成window.console.log()就能避免这个报错
2019-12-31 09:03:00
1566
2
原创 vue 3.0 scss 的配置及用法
1.在项目中使用scss之前，先打开package.json,看看是否已经安装了sass需要的安装包npm install node-sass --savenpm install sass-loader --savenpm install style-loader --save或者npm install node-sass sass-loader style-loader --sav...
2019-12-30 16:03:50
6533
原创 css table 标签样式的设置
border 上设置 边框border-collapse:collapse; 去除空白colspan 横向合并rowspan 纵向合并 <table border="1" style="border-collapse:collapse;"> <tr > <th></th> ...
2019-12-12 16:36:16
489
原创 H5视频插入的两种方式 pc端 video标签里的autopaly自动播放
第一种：<video src="movie.ogg"></video>第二种：<video> <source src="movie.ogg" type="video/ogg" > </video>(type必加属性) **属性设置：**1.Width height设置视频的宽高<video src="movie.ogg" ...
2019-12-12 15:57:28
1473
原创 vue 实现盒子之间相互拖拽排序克隆
1.首先需要安装vuedraggable依赖包：npm install vuedraggable --save2.复制vue html代码到项目：<template> <div class="dndList"> <div class="dndList-list"> <h3>常用</h3> <...
2019-12-11 17:53:43
1328
1
原创 vue 清除页面双击默认样式
清除双击选中的默认样式 mounted() { // 清除双击选中的默认样式 var home = document.getElementById("home"); home.onselectstart = function(ev) { var e = ev || window.event; e.preventDefault(); };...
2019-12-11 17:44:41
435
原创 vue 两个input框设置结束时间大于开始时间
1.效果图2. :picker-options=“pickerOptions0” 控制变量 <el-form-item label="开始时间"> <el-date-picker v-model="customerModel.usedrogeStartime" type="datetime" value-format="yyyy-MM-dd h...
2019-12-11 17:21:41
1123
原创 vue 时间戳转换为日期格式（标准版）
let date1 = data.getTime() var date = new Date(date1); let Y = date.getFullYear() + '年'; ...
2019-12-11 16:51:00
1333
原创 vue table 时间戳转换为日期格式 moment 方法 与管道方法
1.下载插件命令：cnpm i moment --save2.main.js 挂载import moment from ‘moment’//导入文件Vue.prototype.$moment = moment;//赋值使用3.script中使用 methods: { dateFormat: function (row, column) { ...
2019-12-11 16:43:23
979
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人