Vue.js论坛 今日: 0|主題: 240|排名: 78 

🧑‍💻 写在开头 点赞 + 收藏 === 学会🤣🤣🤣 在企业级应用开发中，权限控制是一个绑不开的话题。前端权限控制虽然不能替代后端校验，但能极大提升用户体验——让用户只看到自己能操作的内容，避免无效点击和困惑。 本文将分享一个 Vue 2 自定义指令的设计思路，实现了声明式的权限控制方案。 设计目标 在动手写代码之前 ...

🧑‍💻 写在开头 点赞 + 收藏 === 学会🤣🤣🤣 Vue 3 的 Composition API 给开发者带来了更强的逻辑组织能力，但很多人用 defineProps 的方式，依然停留在 Vue 2 的“Options 语法心智”。本质上只是把 props: {} 拿出来“提前声明”，并没有真正理解它的运行机制、类型推导优势、默认值处理方式、解构陷阱等关键点。 这篇 ...

vxe-table 单选设置允许取消选中,通过设置 radio-row-config.strict=false 允许取消选中 https://vxetable.cn 设置 radio-row-config.strict=false 允许取消选中 <template> <div> <vxe-grid v-bind="gridOptions"></vxe-grid> </div> </template> <script> export default { data() { const gridOpt ...

vxe-table 给单元格加样式的方式详解，支持 style 和 className 的方式给单元格加样式 https://vxetable.cn className 方式 行的样色、单元格样式，表头的样式、表尾的样式、全部都可以完全自定义，通过设置 cell-class-name、header-cell-class-name、row-class-name ...等参数，当自定义样式之后可能会覆盖表格的样式，比 ...

实现 vxe-table 分组列头折叠列功能非常简单，只需改变列的 visible 就可以实现 https://vxetable.cn 通过修改列的 visible 属性来精确控制列的显示隐藏 <template> <div> <vxe-table border height="400" :data="tableData"> <vxe-column type="checkbox" width="60"></vxe-column> ...

🚀 OpenClaw 极速安装与全流程避坑指南：从零到完美运行 OpenClaw 凭借其强大的 AI 自动化能力最近非常火爆。但在 Windows 环境下安装，如果不注意细节，很容易在“第一步”就卡死。本文总结了一套从底层环境搭建到后台服务运行的极速流程，适合所有想体验 OpenClaw 的朋友。 🛠️ 一、 安装前的“地基”准备（必看！） 很 ...

🧑‍💻 写在开头 点赞 + 收藏 === 学会🤣🤣🤣 场景引入 在 Vue 项目里，表单组件几乎无处不在。为了提高复用性，我们常常会把一堆输入框封装成一个“大表单组件”，然后通过 v-model 直接绑定一个对象给外部组件： <!-- App.vue --> <script setup> import { ref } from 'vue' import MyForm from './MyForm ...

🧑‍💻 写在开头 点赞 + 收藏 === 学会🤣🤣🤣 最近接到一个安卓App的活儿，虽然功能上不算复杂，但因为原本没怎么做过安卓端，所以也是"摸着石头过河"。简单写一下踩过的坑和淌的水吧~ uni-app实现离线地图主要用 leafletjs 实现，但是因为在安卓端运行，存在渲染问题，所以还要用上 renderjs。 实现方案一：web-view 因 ...

🧑‍💻 写在开头 点赞 + 收藏 === 学会🤣🤣🤣 上个月，我们重构一个老项目，发现一个“祖传组件”： 父组件传 props 给子组件 子组件再传给孙子 孙子改了个状态，通过 $emit 一层层往上抛 中间任意一层改名，整条链就断了…… 同事苦笑：“这哪是组件通信，这是传话游戏。” 其实，Vue 3 早就提供了更优雅、更健壮的通 ...

🧑‍💻 写在开头 点赞 + 收藏 === 学会🤣🤣🤣 前言：由于“无处安放”而引发的混乱 在 HTML5 普及之前，前端开发者为了在 DOM 元素上绑定一些数据（比如用户 ID、商品价格、状态码），可谓是八仙过海，各显神通： 隐藏域流派：到处塞 <input type="hidden" value="123">，导致 HTML 结构像个堆满杂物的仓库。 Class ...

vue 表格 vxe-table 实现复制单元格时自动带表头，由于业务需求需要实现用户复制单元格粘贴到 excel 时，不知道对应是哪一列，要求需要在粘贴时自动带上表头，可以通过自带的 isCopyHeader 来启用 https://vxetable.cn 通过 clip-config.isCopyHeader 启用 <template> <div> <vxe-grid v-bind="gridOptions"></vxe-g ...

如何使用 vue vxe-table 甘特图 vxe-gantt 渲染显示多行任务，预计完成日期和实际完成日期多条任务条，可以自定义任务条颜色，拖拽调整日期等 https://gantt.vxeui.com 使用树结构渲染子任务和隐藏树节点按钮来实现一行拆分多条任务条，每条任务条还可以通过css变量来设置颜色 --vxe-ui-gantt-view-task-bar-completed-bac ...

vue 甘特图 vxe-gantt 设置每个进度条分为计划和实际两条，实现上下分布任务条，实现方式是利用子任务的子视图渲染模式，来间每条任务拆分成2条子任务，就可以利用自带的子视图渲染功能来渲染。 https://gantt.vxeui.com 由于放2行超出默认高度，所以还需要通过 cell-config.height设置一下行高，再通过树形表格的子任务来 ...

🧑‍💻 写在开头 点赞 + 收藏 === 学会🤣🤣🤣 1. 对齐目标 前端想实现一个类似的书架放置书籍的效果，目标如下： 2. 思路梳理 我们使用的技术栈：vue 实现这样的一个效果，我们需要知道以下信息： 每行可以放置多少书本？ 放下所有的书本需要多少行? 需要什么样的数据结构? 我们现在一个个来思考，既然我们选择了vue来 ...

🧑‍💻 写在开头 点赞 + 收藏 === 学会🤣🤣🤣 起因 周五快下班，老板过来看权限配置页面。 "这个每次都要手动输路径？" "对，现在是这样。"我打开给他看： 角色：运营专员 路由路径：[手动输入] /user/list 组件路径：[手动输入] @/views/user/List.vue "上次运营配错了，/user/list 写成 /user/lists，页面打不开找了 ...

Element UI Table组件基本使用（官方文档） Sortable.js 官方文档 实现步骤 1. 安装SortableJS 通过npm安装： npm install sortablejs --save 或使用国内CDN（推荐）： <script src="https://cdn.jsdelivr.net/npm/sortablejs@1.14.0/Sortable.min.js"></script> 2. 基础拖拽功能实现 在Vue组件中，通过ref获取Table的bod ...

🧑‍💻 写在开头 点赞 + 收藏 === 学会🤣🤣🤣 前言 还记得上周我们团队在招聘前端工程师，一个看起来经验丰富的候选人坐在我对面。 "你们项目中是如何处理按钮重复点击的问题的？"我抛出了这个看似简单的问题。 "这个简单，使用防抖就可以了。"他很快回答。 然而，当我继续追问细节时，他却陷入了沉思... 实际上，这个问 ...

🧑‍💻 写在开头 点赞 + 收藏 === 学会🤣🤣🤣 大家好!😁。 Code Review 的时候，我最怕看到什么？ 不是复杂的算法，也不是什么正则。而是明明一个 HTML 标签就能搞定的事，有人非要写几百行 JS + CSS 去重新发明轮子 。 前几天，我看到一个新同学为了写一个折叠面板（Accordion），引入了一个重型的第三方库，还写了一堆 ...

🧑‍💻 写在开头 点赞 + 收藏 === 学会🤣🤣🤣 aspect-ratio 宽高比 <style> div { width: 190px; /* 注意，这个数字要能容纳完内容才有效 */ aspect-ratio: 16 / 9; background: tomato; } </style> <div>我永远保持 16:9</div> 如果，你 aspect-ratio 的值写成 1 ，那么就可以得 ...

​ wangeditor设置图片宽高默认有30%、50%、100%三种等比缩放选择，但是有的时候需要按照像素控制图片大小不在乎图片是否有拉伸的情况。所以只能编写设置图片宽高的自定义扩展。 ​编辑 1、设置图片大小最好就是与原生一样放置到选中工具栏上最合适，且因为要设置宽高两种属性所以用弹窗嵌套表格方便填写。 2、查看官方文档 ...