- 博客(49)
- 收藏
- 关注
RSS订阅原创 element plus 更换主题色-全部更换
[sass] @use rules must be written before any other 解决
2024-06-04 10:47:44
312
1
原创 echarts地图 图例 visualMap
具体表现为点击之后映射的颜色变为透明，变不回去，分级设色的颜色全部消失。加载地图后，图例的点击事件是datarangeselected。// 手动调用restore方法恢复地图的默认颜色映射。点击visualMap的地图映射效果失效。
2023-06-30 17:15:51
1108
原创 vue3+ts+echarts5基本地图下钻~
/ 获取地图点击区域的名字，根据名字请求本地地图Json。// 使用setOption方法将地图重置为点击的市区。// 记录当前的区域，返回上地图的标识。// 重新生成地图的Json数据。新疆维吾尔自治区: 'xinjiang',香港特别行政区: 'xianggang',// 生成地图并使用本地Json地图数据。宁夏回族自治区: 'ningxia',广西壮族自治区: 'guangxi',广东省: 'guangdong',澳门特别行政区: 'aomen',重庆市: 'chongqing',
2023-06-02 17:51:57
1025
2
原创 vue+echarts 项目中页面切换或者刷新图表宽度改变问题
watch: { isFullScreen (val) { this.$nextTick(() => { this.resizeHandler() }) },}methods: { resizeHandler () { let barChart = this.$echarts.init(this.$refs.barChart1) barChart.resize() }, drawChart .
2022-04-26 15:08:48
661
原创 grid简单布局
height:calc(~'100vh - 420px'); width:100%; display: grid; grid-template-columns: repeat(5,1fr);//列高 grid-template-rows: repeat(2,1fr);//行高 row-gap: 8px;//行间距 column-gap: 8px;//列间距 div:nth-child(7){ ...
2022-04-20 15:40:33
78
原创 echarts技术分享
2.1全局引入main.js中配置（不推荐使用，会导致包过大，冗余多）import echarts from 'echarts' //引入echartsVue.prototype.$echarts = echarts //挂载在原型，组件内使用直接this.$echarts调用122.2组件内按需引入 ( 推荐使用 )这种方式很简单，在需要引入图表的组件引入,例如如下引入柱状图。//在组件引入基本模板let echarts = require("echarts/lib/echarts".
2022-04-15 16:36:34
957
原创 el-tree 与el-select结合数据加载，清空选择 收起列表
<div class="qhTree-main"><el-selectstyle="text-overflow: ellipsis;" v-if="reLoad"size="mini"ref="selectTree"v-model="checkName"placeholder="请选择..."><el-option :value="treeData" style="height: auto"><el-tree ref="tree" la.
2022-03-31 10:49:33
1570
原创 如果el-table数据嵌套过深，导致其中变量改变而表格不刷新，可以在外边的div设置v-if，重新加载div
<div class="topsis-cont" v-if="tableEdit"/>getChange (row, flag) { // 编辑保存选中行信息 if (flag === 1) { // 编辑，保存原值 row.tempData = JSON.parse(JSON.stringify(row)) row.tempData.isEdit = false row.isEdit = true } else..
2022-03-29 15:47:13
844
原创 el-tree与el-select结合，vue组件
<template> <div class="qhTree-main"> <el-select style="text-overflow: ellipsis;" size="mini" ref="selectTree" v-model="checkName" placeholder="请选择..."> <el-option :v.
2022-03-25 10:22:54
2414
原创 el-tree带指定图标动态加载
效果图 <el-tree :load="loadFolder" ref="tree" node-key="data_id" :props="{children: 'children',label: 'name',isLeaf: 'leaf'}" show-checkbox @check-change="handleCheckChange" empty-text = "正在获取数据"> <span class...
2022-03-25 10:19:18
736
原创 el-table表格数据 中文 键值渲染
像是这种数据：地址_乡: "台湖镇"地址_县: "通州区"地址_市: "市辖区"地址_村: null地址_省: "北京市"填写说明: null填表人: "吕鑫"常住人口数量: 69281年末总户数: 18139应急供水设备数量: "0"应急医疗设备数量: "0"需要先在获取的时候处理，放入第三方变量，在渲染时循环 for (const key in res.data.data[) { this.headers.push(key) }<el-tab.
2022-03-17 16:32:06
567
原创 element表格宽度异常
<div class="sjzl-conponent" :class="isFullScreen?'full':'notFull'"> <div style="width: 100%;position: absolute;"> <el-tabs v-model="activeName"> <el-tab-pane label="数据总览" name="first"> ...
2022-03-09 13:51:05
675
原创 在elment自定义步骤条图标
<el-steps :active="1" style="width: 1420px;margin-top: 32px;" align-center="true"> <el-step> <img src="@/icons/数据集成.svg" alt="" slot="icon"> <span slot="description"...
2022-03-09 09:48:30
1145
原创 calc() 不起效
height: calc(100vh - 80px);计算完是20vh因为less，sass会先解析，要禁用这样写 height: calc(~ '100vh - 80px');
2022-03-03 09:31:22
401
原创 如何修改作为背景图片的svg颜色
动态修改svg的颜色，svg做背景色时候修改颜色 - 大桥默默学 - 博客园<div v-for="item in leftFLdata" :key="item.id" style=" position: relative;overflow: hidden;"> <span :style="{backgroundImage: 'url(' + item.icon + ')', mask:'url(' + item.icon + ')'}" clas
2022-03-02 19:54:27
2989
原创 vue--eslint配置
{ "eslint.enable": true, "[xml]": { "editor.defaultFormatter": "DotJoshJohnson.xml" }, "window.zoomLevel": 1, "javascript.updateImportsOnFileMove.enabled": "always", "editor.suggestSelection": "first", "vsintellicode.modify.editor...
2022-02-25 18:02:18
205
原创 setup语法糖实现todo
<template> <div class="todo"> <!-- 计算功能 --> <input type="text" v-model="wantName" /> <button @click="addThing">aaaa</button> <div v-for="(item,index) in dataList" v-bind:key="item.id" style="backgro.
2022-02-18 19:16:22
115
原创 setup语法糖
script setup 是 vue3 的新语法糖，简化了以往的组合式 API 必须返回(return)的写法，并且有更好的运行时性能。内部的属性或方法可以直接使用，无需 return 返回;引入子组件可以自动注册，无需 components 注册<template> <SetUp ref="child"></SetUp> </template> <script setup> import SetUp from "./SetUp.
2022-02-16 10:06:59
1125
原创 watch同时监听多个属性
利用watch和computer， computed: { onChange(val) { const { keyword1, keyword2 } = this;//要监听的变量，直接这样写 return { keyword1, keyword2 }; }, }, watch: { onChange() { //所要执行的代码 if (
2021-10-14 17:26:29
375
原创 日常总结7.23
https://blog.csdn.net/weixin_39141044/article/details/83582384在vue里真实dom和虚拟dom操纵dom元素一般写在mounted普通创建节点创建新的元素节点：document.createElement(‘元素名’)创建新的文本节点：document.createTextNode(‘文本内容’)创建新的片段节点：document.createDocumentFragment()创建新的注释节点：document.createC
2021-07-23 13:55:56
79
原创 git,node,数据库
git指令1、查看本地分支 ： git branch2 删除本地已合并的分支： git branch -d [branchname] 某些情况下可以用 git branch -D [branchName] (使用时应注意是否已合并)3、删除远程分支: git push origin --delete [branchname]4、创建分支 ：git branch [branchname]5、 查看全部分支(包含本地和远程) ：git branch -a6、根据指定版本号创建分支: gi
2021-06-30 22:46:18
248
原创 vue面试题
watch方法和属性【2】immediate属性使用watch时有一个特点，就是当值第一次绑定的时候，不会执行监听函数，只有值发生改变才会执行。如果我们需要在最初绑定值的时候也执行函数，则就需要用到immediate属性。immediate:true代表如果在 wacth 里声明了 firstName 之后，就会立即先去执行里面的handler方法，如果为 false就跟我们以前的效果一样，不会在绑定的时候就执行。【3】deep属性(深度监听)当需要监听一个对象的改变时，普通的watch
2021-06-30 22:45:28
375
原创 html,css,http面试题
如何水平垂直居中一个元素text-algin:center;line-height:heightpopsition:absolute;left:50%;top:50%display:flex;margin:autolink和@import的区别link属于html标签。@import在css中使用表示导入外部样式表；页面被加载的时，link会同时被加载，而@import引用的CSS会等到页面被加载完再加载;import只在IE5以上才能识别，而link是HTML标签，无兼容问题;l
2021-06-30 22:36:13
744
原创 js面试题
1js冒泡排序,快速排序,时间空间复杂度var arr = [3, 10, 6, 2];// 遍历数组for (var i = 0; i < arr.length - 1; i++) { // 这里要根据外层for循环的 i ，逐渐减少内层 for 循环的次数 for (var j = 0; j < arr.length - 1 - i; j++) { if (arr[j] > arr[j + 1]) { var num..
2021-06-30 19:50:35
485
原创 微信小程序基础
1、小程序的优势和劣势有哪些？优势：微信助力更加容易推广，入口众多。在微信中，小程序拥有众多入口，例如附近的小程序、小程序码、分享、发现-小程序等五十多个的入口。这些入口有助于企业更好的获取流量，从而进行转化、变现。使用便捷，无需下载。只需要轻轻点一下就可以使用，更加符合用户对使用方便、快捷的需求，所以小程序的用户数量不断增加。体验良好，有接近原生app的体验。在微信生态里，小程序在功能和体验上是可以秒杀掉 H5 页面的，H5 页面经常出现卡顿、延时、加载慢、权限不足等原因，而这些问题在小程序里都不
2021-04-30 16:47:38
987
4
原创 Vue基础的基础
什么是vue前端渐进式JavaScript 框架，框架和库的区别框架 ：是一套完整的解决方案；对项目的侵入性较大，项目如果需要更换框架，则需要重新架构整个项目。库（插件）：提供某一个小功能，对项目的侵入性较小，如果某个库无法完成某些需求，可以很容易切换到其它库实现需求。mvc和mvvm的区别MVC中 M是model:与数据库交互,V是view:页面展示,用户交互，c是controller:调度，MVVM中M是model:业务逻辑,v是view:展示页面, vm是view-model:交互v
2021-04-01 20:10:38
163
原创 vue总结
过滤器过滤器的定义全局定义Vue.filter(“过滤器的名字”,function (data（原数据）,…其他参数（format格式）){return “最终显示的值”})私有定义new Vue({filters:{// key： 过滤器的名字// value: 处理函数名字:function(data,…其他参数){return '最终的结果"}}})过滤器的使用通过管道符使用{{name | 过滤器的名字 }}// 可以有多个过滤器{{name | 过滤器的名字
2021-03-31 14:10:15
188
原创 vue组件
vue组件拆分代码量组件化:是从UI界面的角度进行划分的；前端的组件化，方便UI组件的重用模块化：是从代码逻辑的角度进行划分的；方便代码分层开发，保证每个功能模块的职能单一全局组件定义四种注意：组件中的DOM结构，有且只能有唯一的根元素（Root Element）来进行包裹！1.使用 Vue.extend 配合 Vue.component 方法Vue.component(“register”,Vue.extend({template:‘hh’}))2.直接使用 Vue.component 方
2021-03-29 18:20:43
123
原创 vue请求,动画
引入resource 放在引入vue后面一般 在 created()生命周期函数内写请求和数据初始化get请求地址栏传参?num=3post请求两个参数 url 和data （请求体）浏览器内置对象FormDatalet form = new FormData两个参数 属性名，属性值form.append(“type”, “free”)v-enterv-enter-active定义进入的过渡状态v-enter-to定义进入过渡的开始状态v-leavev-leave-activ
2021-03-29 15:21:56
179
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人