请先点击链接RobinDevNotes，体验用VuePress搭建博客的效果（logo还没有合适的替换），目前部署在GitHub Pages上，国内访问速度还可以，再阅读本文感受来龙去脉和搭建过程。 最近准备自己要写点小项目，当前技术栈是以运维和后端为主，自己要写项目的话还是要会一些前端技术，选择学 ...

‍ 写在开头 点赞 + 收藏 学会 前言 老板：新的需求不是上线了嘛，怎么用户看到的还是老的页面呀 窝囊废：让用户刷新一下页面，或者清一下缓存 老板：那我得告诉用户，刷新一下页面，或者清一下缓存，才能看到新的页面呀，感觉用户体验不好啊，不能直接刷新页面嘛？ 窝囊废：可以解决（OS ...

在使用 vxe-from 表单时，可能由于绑定项非常多，这个时候可能就需要将表单进行分类分组，可以泰国片页签的当时进行拆分组。 <template> <div> <vxe-tabs v-model="activeTab" height="200"> <vxe-tab-pane title="页签1" ...

当需要再表格中的某个字段是关联另外一张表示，需要将从另外表选择数据，并将数据保存在当前行中 官网：https://vxetable.cn <template> <div> <vxe-grid v-bind="gridOptions"> <template #action="{ row }"> <vx ...

在公司开发大型项目中，使用主流表格库 vxe-table v3 和 ant-design-vue 组件库，可以在可编辑单元格中渲染非常简单的使用更多的组件 官网：https://vxetable.cn 安装 npm install vxe-pc-ui@3.3.9 vxe-table@3.11.10 ...

在 vxe-table 启用列多选功能，通过参数 column.type = 'checkbox' 设置类型为多选类型就可以了。 官网：https://vxetable.cn <template> <div> <vxe-grid v-bind="gridOptions"></vxe-grid> </ ...

在 vxe-table 启用列单选功能，通过参数 column.type = 'radio' 设置类型为单选类型就可以了。 官网：https://vxetable.cn <template> <div> <vxe-grid v-bind="gridOptions"></vxe-grid> </div ...

在 vxe-table 使用排序功能非常简单，给列加上 columns.sortable 属性就可以启用列的排序功能，当然这是本地排序，就是对当前已加载过当前页的数据进行排序。对于查询列表列表，项目中使用最多的是服务端排序，因为大部分都涉及分页。 前端排序 这样就可以启用前端数据排序，仅限于当前页 ...

实现表格数据分组，按指定字段数据分组，使用树结构来实现分组功能。 官网：https://vxetable.cn <template> <div> <vxe-grid v-bind="gridOptions"></vxe-grid> </div> </template> <script> import ...

正常情况下如果需要使用文本超出隐藏，通过 css 就可以完成 overflow: hidden; text-overflow: ellipsis; white-space: nowrap; 但是如果需要实现多行文本溢出，就很难实现里，谷歌浏览器虽然支持 css 多行溢出，大部分浏览器又不支持，所以作 ...

在使用 vxe-grid 时，需要实现表尾合计功能，通过单元格编辑之后，实时自动计算表尾合计的值，自动更新表尾合计数据，实现方式通过监听change 事件，从而实现实时更新合计功能。 官网：https://vxetable.cn 可以使用插槽模板，也可以使用配置式，下面是配置式的用法： <templ ...

‍ 写在开头 点赞 + 收藏 学会 不翻墙也能使用的地图还有Mapbox 安装 npm install --save axios npm install --save mapbox-gl npm install --save @mapbox/mapbox-gl-direction ...

前言 watch这个API大家都很熟悉，今天这篇文章欧阳来带你搞清楚Vue3的watch是如何实现对响应式数据进行监听的。注：本文使用的Vue版本为3.5.13。 关注公众号：【前端欧阳】，给自己一个进阶vue的机会 看个demo 我们来看个简单的demo，代码如下： <template> <but ...

vxe-modal 实现窗口拖拽调整宽高 官网：https://vxeui.com <template> <div> <vxe-button content="点击弹出" @click="showPopup = true"></vxe-button> <vxe-modal v-model="show ...

vxe-modal 实现窗口最大化与最小化 官网：https://vxeui.com <template> <div> <vxe-button content="点击弹出" @click="openEvent"></vxe-button> </div> </template> <script> im ...

官网：https://vxeui.com <template> <div> <vxe-form v-bind="formOptions" @submit="submitEvent" @reset="resetEvent"> </vxe-form> </div> </template> <script ...

官网：https://vxeui.com <template> <div> <vxe-form v-bind="formOptions" @submit="submitEvent"> </vxe-form> </div> </template> <script> import { VxeUI } f ...

官网：https://vxeui.com <template> <div> <vxe-form v-bind="formOptions"></vxe-form> </div> </template> <script> export default { data () { const formOpti ...

vxe-table 是一个全功能 vue 表格库，非常强大的功能基本可以满足对表格对表格的一切需求。不管是普通列表，大数据列表。可编辑表格，数据校验、Excel 单元格选择、复制粘贴等。。。 官网：https://vxetable.cn gitee 安装 npm install vxe-pc-ui@ ...

vxe-table 内置非常强大 H5 打印，只需要传入 html 代码和 css 样式，就可以实现任何复杂的打印 官网：https://vxeui.com <template> <div> <vxe-button @click="printEvent">点击打印</vxe-button> <div ...