随笔分类 - vue随笔
摘要：Dexie.js 是一个基于 IndexedDB 的轻量级 JavaScript 库，它提供了更简单、更友好的 API 来操作浏览器中的 IndexedDB 数据库。下面是 Dexie.js 的基本使用教程。 1. 安装 Dexie.js 可以通过 npm 或直接通过 CDN 引入 Dexie.js
阅读全文
摘要：一、getCurrentInstance基本用法我们可以通过 getCurrentInstance这个函数来返回当前组件的实例对象,也就是当前vue这个实例对象Vue2中，可以通过this来获取当前组件实例；Vue3中，在setup中无法通过this获取组件实例，console.log(this)打
阅读全文
摘要：在折叠面板的表头添加了一个删除按钮，但是点击的时候会同时触发收缩事件和删除事件，要求点击删除的时候阻止收缩事件： 解决方案：使用iview的按钮组件（因为native不能绑定原生标签），添加v-on:click.native.stop可以组件折叠面板的收缩事件，并正常触发删除事件 <!-- 折叠面板
阅读全文
摘要：ascend：上升，升高，动词 descend：下降，动词 key: 'XXX', //如果不写key，排序可能不生效，sortMethod中的a和b取值是undefined sortable:true, sortType: 'desc', //初始化排序 sortMethod:(a,b,type)
阅读全文
摘要：今天在使用IVIEW的时候要设置默认选中项，文档如下： 给 data 项设置特殊 key _checked: true 可以默认选中当前项。 给 data 项设置特殊 key _disabled: true 可以禁止选择当前项。 代码如下： <Table ref="selection" :colum
阅读全文
摘要：{ title: "核算项", dataIndex: "hesxName", key: "hesxName", align: "center", customRender: (text, record, index) => { const obj = { children: text !== nul
阅读全文
摘要：之前我们前端对身份证的校验，都是用的正则校验legalTex = /^\d{6}(18|19|20)\d{2}(0\d|10|11|12)([0-2]\d|30|31)\d{3}(\d|X|x)$/ 但是这个正则的含义仅仅表示身份证号码为15位或者18位，15位时全为数字，18位前17位为数字，最后
阅读全文
摘要：一、安装（注意webpack-plugin对应版本，否则不能运行） yarn add monaco-editor@0.29.1 yarn add monaco-editor-webpack-plugin@5.0.0 -D 二、配置vue.config.js const MonacoWebpackPl
阅读全文
摘要：在网上搜了好多修改表格头部样式的，最后自己摸索出来，分享给大家，最后附上完整代码。首先用到的是customHeaderRow这个API，类型是一个函数 1.HTML部分 <a-table size='small' // 样式大小 :columns="columns" :data-source="da
阅读全文
摘要：在Ant Design Vue中，Table组件提供了一个expandedRowRender属性，可以用来自定义展开行后显示的内容。如果你想在点击展开行时加载数据，可以在expandedRowRender函数中实现异步数据加载。 以下是一个简单的例子，展示了如何在点击展开行时加载数据： <templ
阅读全文
摘要：Vue Router路由push不同参数跳转同一页面 页面不刷新问题 在vue项目开发中，使用路由进行页面跳转时，路由所跳转的页面不进行刷新。也就是vue生命周期函数没有执行(created、mounted钩子函数) 1.常规解决办法路由监听watch watch: { '$route' (to,
阅读全文
摘要：最近在做项目时，客户有个发布新闻动态的功能，具体页面内容让客户自己编写，所以要选择富文本编辑器，这样用户体验好一点。网上有很多的富文本编辑器， 因为项目的功能并不是很复杂，所以选择了wangEditor，界面简洁，使用起来也挺方便的； 实现思路 1.安装wangEditor2.封装成组件3.父组件中
阅读全文
摘要：一. 问题讲解 我们在使用百度 2D 地图时，添加其搜索控件 <bm-control> <bm-auto-complete v-model="workAddress" :sugStyle="{ zIndex: 999999 }" @confirm="handleConfirm"> <el-input
阅读全文
摘要：1.首先是给表格加自增序号 { title: "序号", customRender: (text, record, index) => `${index + 1}`, }, 这样就加上了 2.然后是ant没有key值控制台报错 如果有id或者唯一属性可以把rowkey设置为唯一属性查了一下也不一定是
阅读全文
摘要：1. 效果图 2. 引入echarts npm install echarts --save 3. main.js全局引入 4. 页面 data数据是从后台接口中返回的，需要通过watch监听来获取created方法中获取到的数据。用mounted由于是异步调用，是获取不到created中的数据的。
阅读全文
摘要：右侧操作列的属性为fixed：'right'在展开行时出现列错位的问题 打开element发现列属性设置为fixed后在DOM中是独立出来的 解决办法： <a-table :columns="columns" :data-source="data" bordered :pagination="fal
阅读全文
摘要：ant design vue树形表格默认展开所有行，并且去掉 + 号 ant desig vue 的 table组件 中的树形表格默认是不展示所有内容，并且在父元素前面会显示一个“+” 号，但是这样的样式影响表格的实用性和美观性，设计的过程中可以解决这两个问题让页面更美观详细。（树形表格默认样式如下
阅读全文
摘要：最简单的方法 export default { name: 'your name', beforeCreate () { document.querySelector('body').setAttribute('style', 'background:#fff') }, beforeDestroy
阅读全文
摘要：在开发项目的时候，发现需要获取经纬度，由于这个项目是用vue写的，最后决定使用vue-baidu-map来快速获取经纬度 基于 Vue.js 封装的百度地图组件，运行流畅，代码简单易懂，几乎包含了百度地图官方的所有API，文档地址:https://dafrok.github.io/vue-baidu
阅读全文
摘要：VUE 滚动到底部加载更多（附带指令实现方式） 直接上代码： mounted() { window.addEventListener('scroll', this.handleScroll, true); }, destroyed() { window.removeEventListener('sc
阅读全文
浙公网安备 33010602011771号