搜索了下程序模版,找到了一个极速应用模版,专门开发程序的,可以看到很多类型的模版,有复杂样式,常见组件,功能特点如下:1.丰富的组件及模版可以拖拽组件,单独对组件元素设置各种属性而不需要一句代码2.可以打包成微信开发工具源码可随时发布,随时扫描3.包含完整详细的后台操作界面,数据管理,用户管理等4.教程及社区问题讨论较为完善但是。。。看着很美好。。其实我只想要某个页面。。或者想把模版拿到后继续
转载 2024-03-14 09:05:30
86阅读
背景项目需要表格支持拉伸每列的宽度,查看了文档,官方建议是用 vue-draggable-resizable 插件结合 components 属性,给表头 header 增加一个可拖拽的功能。其实下面的前三个问题都很好解决,网上也有很多解决方案,但因为考虑到项目中表格很多,而且每个表格都要支持拉伸列宽度,所以不可能按官方文档那样,每个表格的 vue 组件都写重复的代码,所以就封装了一个方法,专门获
转载 2024-07-24 09:52:03
2519阅读
最近在完成web端在线绘图功能时,需要开发一个从左侧拖拽一种图标到画布中。调研了非常多种现在做拖拽布局的组件,调研的地址是:https://vuejsexamples.com/tag/drag/经过比较,选择了一款优秀的可拖拽框架,vue-grid-layout。npm安装npm install vue-grid-layout --save使用demo<grid-layout
<a-form :model="formState" :label-col="labelCol" :wrapper-col="wrapperCol"> </a-form> label-col是label 标签布局 不做响应布局 :label-col="{ style: { width: `${'9 ...
转载 2021-10-11 22:45:00
1401阅读
2评论
 代码仓库地址:https://github.com/imxiaoer/WeChatMiniCalendar 一、效果图如下:  二、业务场景介绍客户原始需求:用户需要知道在选中的月份中,哪些日期是有客户预约的,并且显示当天预约人数,点击有预约的日期则进入预约信息详细页,详细页内可以新建预约;点击没有预约的日期则直接进入新建预约页面。 三、需求实现
转载 2024-10-22 16:20:48
89阅读
Ant Design布局 我们来讲一下Ant Design布局空间布局是体系化视觉设计的起点,和传统的平面设计的不同之处在于,UI界面的布局空间要基于『动态、体系化』的角度出发展开,我们受到建筑界大师柯布西耶的模度思想的启发,基于『秩序之美』的原则,探索UI设计中的动态空间秩序。 在中后台视觉体系中定义布局系统,建议从5个方面出发: 1.统一的画板尺寸 2.适配方案 3.网络单位 4.栅格 5.
转载 2024-02-27 08:18:46
175阅读
不bb先看效果 bb两句最近在做一个基于vue的后台管理项目。平时项目进度统计就在上禅道上进行。so~ 然后领导就感觉这个拖拽效果还行,能不能加到咱们项目里面。 既然领导发话,那就开干。。所有技术:vue + vuedraggable拖动的实现基于 vuedraggable的插件开发。主页为两栏流式布局,每一个组件可以在上下拖动,也可以左右拖动。 基本步骤布局这块布局为最为普通的两栏布局,这里采
转载 10月前
310阅读
vue3 实现组件拖拽案例一.实现效果将不同组件拖拽至展示区展示拖拽拖拽后,取消后还原(没有动态演示真抱歉)二.实现过程页面基本样式<template> <div class="drag-view"> <!-- 拖拽页面基本布局 --> <div class="drag-left"> 预览区 <d
React & Ant-Design 应用 —— Grid栈格设置布局、Space间距设置自适应内容问题描述居中布局 :Grid栈格Space设置间距总结 今天在实践中,我第一次使用了Grid栈格来设置布局,也用了Space来设置合适的间距。通过Grid配合Space,设置出来了居中且自适应的Ant-Design组件。因为是第一次使用到Grid和Space,所以做一些记录。可供居中布局
一、基本使用一个Table表格主要由表头和表格内容(即数据)组成,所以最基本的Table就是由column、dataSource这两个属性组成。const dataSource = [{ key: '1', name: '胡彦斌', age: 32, address: '西湖区湖底公园1号' }, { key: '2', name: '胡彦祖', age: 42,
转载 2024-03-03 15:48:55
482阅读
文章目录1. Ant Design Pro 的布局1.1 如何使用 Ant Design Pro 布局1.2 Pro 扩展配置2. Ant Design 布局组件2.1 Grid 组件2.2 Layout 组件2.3 根据不同场景区分抽离布局组件 页面整体布局是一个产品最外层的框架结构,往往会包含导航、页脚、侧边栏、通知栏以及内容等。在页面之中,也有很多区块的布局结构。在真实项目中,页面布局通常
转载 2024-04-08 07:11:16
285阅读
spring boot 与 Ant Design of Vue 首页布局的实现(五)前言本章内容腾讯视频大家可以直接扫描上面的二维码关注我的,然后回复【ant05】 里面就会给到源代码的下载地址同时会附上相应的视频教程,并定期在我的上给大家推送相应的技术文章,欢迎大家关注我的。前言之前在上编写了基于spring-boot和iview的前后端分离系...
原创 2022-02-11 16:08:51
146阅读
  spring boot 与 Ant Design of Vue 首页布局的实现(五) 公众号 前后端系列视频文章汇总帖 前言 本章内容 腾讯视频     前言 之前在CSDN上编写了基于spring-boot和iview的前后端分离系列,使用图文和代码的形式给大家进行了一次接近40遍文章的分享,因编写博文的时候受文笔能力的限制,因此涉及到很多的点都没有细说,因此在这里给大家出了基于spr
原创 2021-07-09 18:23:09
554阅读
1.效果:拖拽前: 拖拽后:2.实现:<template> <a-card :bordered="false"> <a-table bordered :columns="columns" :data-source="data" :customRow="customRow" :pagination="pagination" @change="ta
转载 2024-02-09 17:04:41
50阅读
本篇文档主要是利用echarts实现可拖动节点的折现图,在echarts中找到了一个demo,传送门:https://echarts.baidu.com/examples/editor.html?c=line-draggable,但是不是用vue写的,并且在改写为vue组件的过程中遇到了很多问题,在百度过程中发现并没有相关的文档,所以决定自己开发,并在demo的基础上开发了一些实用的功能,所以把这
转载 5月前
26阅读
Spring Boot 学习记录笔记【 五 】集成 Ant Design Vue页面布局官网代码展示自定义组件目录the-footer.vue 代码展示the-header.vue 代码展示the-left.vue 代码展示App.vue 代码修改HomeView.vue 代码调整全局图标页面解析错误解决集成HTTP库Axios数据绑定结尾 集成 Ant Design Vue安装命令:npm i
转载 2024-04-11 12:07:55
301阅读
   介绍在vue中使用antV-G2展示散点图G2 是一套基于图形语法理论的可视化底层引擎,以数据驱动,提供图形语法与交互语法,具有高度的易用性和扩展性。使用 G2,你可以无需关注图表各种繁琐的实现细节,一条语句即可使用 Canvas 或 SVG 构建出各种各样的可交互的统计图表。一、安装 antV-G2通过 npm 安装npm install @antv/g2 -
ant design vue组件库中,并没有提供可以直接监听table滚动的api,在此我使用了原生js去对table表格赋予一个监听表格滚动事件。在处理一写数据量特别大的情况下,我们不能把后端的数据一次性全部拿到前端在table表格中展示,为了考虑性能优化,使用了滚动加载表格数据。做这个功能之前,我们首先需要获取到table滚动到底部或者顶部时去触发方法。首先我想要对表格进行滚动加载,接口需要
一、概述 参看地址:https://pro.ant.design/docs/layout-cn 其实在上述地址ant-design上已经有详细介绍,本文知识简述概要。 页面整体布局是一个产品最外层的框架结构,往往会包含导航、页脚、侧边栏、通知栏以及内容等。在页面之中,也有很多区块的布局结构。Ant
转载 2018-11-29 23:30:00
957阅读
2评论
项目场景:1,ant-design-vue 使用表单导入展示数据 2,项目需求显示为如下图所示,故涉及复杂表头的处理和显示 3,本篇文章主要以复杂表头的处理讲解为主,简单表头导入导出均引入xlsx之类的插件即可使用 循环对应产品属性的参与者信息并且标记填充展示功能分析:1,导出的效果,如果用原生自带的程序,是不会将两级复杂表头导出的,会默认展示两层表头的第二层,比如这样;由于没有一级表头的区分,故
转载 2024-07-02 20:55:37
157阅读
  • 1
  • 2
  • 3
  • 4
  • 5