Vue
vue
拢手点烟丶
细节决定成败,态度决定一切,向上吧,少年!
展开
-
vue路由缓存
在业务场景中有时候需要页面缓存不清空,那么就需要保留缓存(include为需要缓存,而exclude为不缓存,且优先级大于include)是一个内置组件,它的功能是在多个组件间动态切换时缓存被移除的组件实例。原创 2024-06-06 14:01:35 · 369 阅读 · 0 评论 -
vue拖拽div盒子实现上下拖动互换
【代码】vue拖拽div盒子实现上下拖动互换。原创 2023-08-25 16:38:08 · 677 阅读 · 0 评论 -
高德地图自定义标记点marker缩放偏移问题
原因:造成这种现象的原因其实是对标记点的偏移量offset属性理解不准确导致,查阅官方文档得知,offset默认值是[0,0],就是定位中心点是在图标的左上角,带着此种思维再去看刚才的效果就可以发现,其实是没有偏移的,只是图标定位点在底部,缩放时造成的视觉上错觉,我们可以看到,如果把视觉焦点聚焦在左上角[0,0]的位置,其实定位一直是准确的。为了符合图标底部是实际定位点的效果,可以看到图标大小是35*38,基于左上角原点,x轴偏移半个宽度,y轴偏移整个高度即可,即offset: [-17.5, -38]原创 2023-04-24 18:56:45 · 2635 阅读 · 0 评论 -
解决微信头像填写,微信临时路径不能持久化问题
把微信获取到临时路径图片转存到本地,然后通过本地在获取,在传到服务器,在通过接口存储到数据库,实现持久化。原创 2023-04-18 22:41:25 · 670 阅读 · 3 评论 -
vue网站导航栏吸顶效果
vue网站导航栏吸顶效果分别是h5部分,script部分,css部分<template> <div ref="header" class="header-container"> 123 </div></template>mounted() { var scrollTop = document.documentElement.scrollTop || document.body.scrol原创 2021-09-22 10:14:34 · 394 阅读 · 1 评论 -
vue使用webpack封装组件上传到npm
vue使用webpack封装组件上传到npm组件上传npm,使用简易版webpack1. 为什么使用简易版,因为好配置vue init webpack-simple jwq-ui//jwq-ui是名称,请选择npm里面没有的名称2.创建components文件夹,里面放自己的组件,在跟目录下新建index.js作为入口文件3.index.js文件的内容import firstComponent from "./src/components/firstComponent"import se原创 2021-08-19 09:45:47 · 310 阅读 · 2 评论 -
uni-app的scroll-view
uni-app的scroll-view<template> <view class="j-scroll"> <!-- scroll-x是允许横向滚动 scroll-y是允许纵向滚动--> <scroll-view scroll-x> <!-- 这里面放内容--> </scroll-view </view></template><style scoped lang=原创 2021-04-16 10:52:56 · 1075 阅读 · 0 评论 -
vue动态切换组件component
vue动态切换组件componentindex.vue<template> <div> <button @click="change('test')">动态更改组件</button> <component :is="item"></component> <!--这个is绑定的是注册的组件名 --> </div></template><sc原创 2021-03-29 11:30:13 · 617 阅读 · 0 评论 -
解决烦人的eslint
解决烦人的eslint由于大部分人写项目的方式方法不同,如果项目理由eslint的话,自然会出现很多的爆红,对于强迫症的我来说,我还是喜欢先把他注释掉,在合并时放出来//在webpack.base.conf.js中找到function resolve (dir) { return path.join(__dirname, '..', dir)}const createLintingRule = () => ({ // test: /\.(js|vue)$/, // loader原创 2021-02-20 10:30:07 · 407 阅读 · 2 评论 -
‘yyyy-MM-dd HH:MM:SS’格式的字符串转日期vue
‘yyyy-MM-dd HH:MM:SS’格式的字符串转日期vue<template></template><script> export default { created() { let startTm='2021-02-15 00:00:00' let endTm='2021-02-26 00:00:00' let date = new Date() //两个字符串比较原创 2021-02-07 11:20:25 · 1399 阅读 · 2 评论 -
vue把网页转换成图片html2canvas
vue把网页转换成图片html2canvasnpm 导入html2canvasnpm install html2canvas在使用的页面导入import html2canvas from 'html2canvas'使用<template> <div> <div ref="image"> 把需要转换成图片的代码写在里面 </div> <button @click="toImage">下载原创 2021-01-28 15:21:17 · 484 阅读 · 0 评论 -
vue+elementui 动态增减表单
vue+elementui 动态增减表单<template> <div v-for="(item, index) in dataForm.domains"> <el-row :gutter="20"> <el-col :span="7"> <el-form-item label="内容" :key原创 2021-01-28 14:42:19 · 608 阅读 · 0 评论 -
vue+elementui+print.js
vue+elementui+print.js首先去资源中下载print.js在项目下的static中建立一个文件夹print-plugs在mian.js中导入import Print from '../static/plugins/print-plugs/print' // 打印Vue.use(Print)使用print.js<template> <div> <div ref="printCont"> <di原创 2021-01-28 11:28:23 · 616 阅读 · 1 评论 -
echarts+vue
echarts+vue//echarts的npm安装npm install echarts --save//or (或者)cnpm install echarts --save//main.jsimport echarts from 'echarts'Vue.prototype.$echarts = echarts//全局使用this.$echarts<template> <div ref="top" class="top-child-foot"></di原创 2021-01-26 17:43:59 · 357 阅读 · 0 评论 -
vue+elementui中使用echarts给柱形图添加背景色
vue+elementui中使用echarts给柱形图添加背景色首先使用npm安装echartsnpm install echarts --save//or(或者使用)cnpm install echarts --save在main中引入echartsimport echarts from 'echarts'Vue.prototype.$echarts = echarts//全局引入,并配置全局变量,使用this.$echarts在文件中使用echarts<temp原创 2021-01-25 10:07:22 · 1773 阅读 · 0 评论 -
需求:基于elementui在表格里面可输入
需求:基于elementui在表格里面可输入要怎么实现呢?我们的思路肯定是在表格里面放input,然后把input边框隐藏起来,就可以做到表格可输入//template里<table> <tr> <th>地区</th> <th>人数</th> </tr> <tr> <td>上海区</td>原创 2021-01-23 11:00:11 · 1285 阅读 · 0 评论 -
针对elementui表格字段有时候会飘来飘去,和代码内的顺序不一致
针对elementui表格字段有时候会飘来飘去,和代码内的顺序不一致//在每一个 el-table-column下面加上key进行排序<el-table-column prop="apply" label="专业" header-align="center" align="center" key="0"></el-table-column> <el-table-column prop="level" label="层次" header-align="ce原创 2021-01-22 15:06:15 · 304 阅读 · 0 评论 -
修改主题色elementui
修改主题色elementui1.在下面修改主题色,并下载官网链接:https://element.eleme.cn/#/zh-CN/theme/preview2.解压下载文件3.把theme文件拉到项目中4.在main.js中加入import Vue from 'vue'import Element from 'element-ui'import './element-variables.scss'Vue.use(Element)5.要是修改主题色后,使用element框架的i原创 2021-01-22 10:48:20 · 215 阅读 · 1 评论 -
vue中的computed(计算属性)get和set
vue中的computed(计算属性)get和setdata() { return { a:1 }},computed : { changeA() { return this.a+1 }}//这个时候调用的是get属性data() { return { a:1 }},computed : { changeA() { get() { return this.a + 1 }, set(val) {原创 2021-01-07 15:41:55 · 892 阅读 · 0 评论 -
vue+element 级联选择器(数据处理)
vue+element 级联选择器(数据处理) <el-cascader v-model="majorList" :options="options" :props="optionProps" clearable filterable collapse-tags placeholder="原创 2020-12-24 15:50:05 · 1380 阅读 · 1 评论 -
vue+elementui 自定义常用校验规则
vue+elementui 自定义常用校验规则暂时先发四种,业务亲测有效,会更新的邮箱校验var checkEmail = (rule, value, callback) => { const mailReg = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+(.[a-zA-Z0-9_-])+/ if (!value) { return callback(new Error('邮箱不能为空')) }原创 2020-12-23 15:16:02 · 517 阅读 · 0 评论 -
vue表单时时保存功能
vue表单时时保存功能利用watch去监听表单的变化 watch:{ dataForm:{ handler:function (newVal,oldVal) { // console.log(newVal,'asdada',oldVal) setTimeout(()=> { this.holdChangeForm() },10000) // this.holdCh原创 2020-12-23 14:35:13 · 1893 阅读 · 4 评论 -
vue中pdf,word等格式详情查看解决方案(谷歌、火狐浏览器不支持.doc等格式的问题)
vue PDF,word等格式详情查看vue使用vue-pdf插件显示npm安装:npm install --save vue-pdf使用见https://www.npmjs.com/package/vue-pdfvue使用iframe(推荐)显示iframe<iframe :src="pdf" frameborder="0" style="width: 100%; height: 800px"></iframe>//pdf 为链接上面的if原创 2020-12-21 15:36:27 · 879 阅读 · 0 评论 -
vue+element复选框的坑
vue+element复选框的坑官网写法链接https://element.eleme.cn/#/zh-CN/component/checkbox<el-checkbox v-for="city in cities" :label="city" :key="city">{{city}}</el-checkbox>改进后可以变成竖排并且在下面加上文本框只要把循环写在el-checkbox即可<el-checkbox-group v-model="checkL原创 2020-12-16 17:28:08 · 362 阅读 · 0 评论