Ant Design Vue 知识整理-小白篇

最新推荐文章于 2024-12-04 09:26:58 发布

爱吃黄瓜的喵

最新推荐文章于 2024-12-04 09:26:58 发布

阅读量429

点赞数

CC 4.0 BY-SA版权

本文链接：https://blog.csdn.net/weixin_42152696/article/details/118330674

这篇博客主要介绍了Ant Design Vue的基础组件使用，包括a-date-picker、a-select和a-input的配置，以及如何修改a-input的文字颜色、背景颜色和边框样式，适合初学者入门。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Ant Design Vue 官网

Ant Design Vue 知识整理

Ant Design Vue 知识整理

Ant Design Vue 知识整理

a-date-picker 使用

<a-date-picker 
	v-modal="value1"
	dateFormat="YYYY/MM/DD"
	@change="date1Change"
	placeholder="请选择值班日期" 
/>

<script>
dutyDateChange(date, dateString) {
    
    	
	// 变量赋值
	this.queryParam.date1 = dateString
},
</script>

a-select 使用

最低0.47元/天解锁文章

200万优质内容无限畅学

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

爱吃黄瓜的喵

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
打赏
打赏
打赏举报

举报

专栏目录

vue3+ant-design-vue - 最新实现“侧边动态导航栏+面包屑导航“功能，vue3+ant后台管理系统左侧动态菜单栏和面包屑菜单实现，面包屑和菜单根据路由动态自动处理（详细示例代码）

高级前端工程师

04-02

1万+

vue3，ant-design-vue，antd，el-breadcrumb，a-menu，动态导航栏和面包屑，vue3+ant design vue动态面包屑，动态导航栏，菜单栏，vue3监听路由变化,动态修改面包屑，antd-vue3实现面包屑，vue3中使用antd-vue实现面包屑导航，头部面包屑导航，vue后台管理系统，面包屑头部导航栏，详细示例demo，动态生成面包屑导航教程，新手小白详细示例，面包屑和布局和菜单demo，面包屑和导航菜单的联动，如何跟随路由变化，监听路由变化,动态修改面包屑，v

vue3+ant design vue 实现Tree树形控件带搜索库并可关键字搜索筛选功能，Antd组件库a-tree可搜索的树展示搜索结果并展开（根据关键字搜索过滤tree树列表数据，详细示例代码）

最新发布

高级前端工程师

05-08

4908

Vue3 AntDesign可搜索的树（只展示搜索结果并展开）vue3+antd使用andt-tree实现可搜索的tree_antd选择树搜索，vue3项目Antd 实现Tree树形控件带搜索功能，支持搜索展开tree，antd-tree组件带搜索框，Ant Design Vue3组件Tree树形控件，Tree组件实现可搜索的树，ant.design组件库中的Tree组件实现可搜索的树，树控件的搜索功能，antd Tree 组件带搜索，动态list数据，tree嵌套数据，搜索后关键字标红，具备搜索功能的树

参与评论您还未登录，请先登录后发表或查看评论

Vue+Ant Design Vue学习经验分享1.doc

08-14

本文档主要是本人对Vue和Ant Design Vue学习后总结的经验，方便其它同事能够通过该文档对该技术有所了解 , 同时方便产品团队对前后分离的技术有增加知识储备。目录如下 2.Vue经验分享 2.1 Vue介绍 2.2 Vue的MVVM模式介绍 2.3 Vue之HelloWorld 2.4 Vue的生命周期 2.5 Vue的常用指令 2.6 Vue-CLI脚手架介绍 2.7 使用Vue-cli构建Vue项目 2.8 Vue项目及其目录结构说明 2.9 基于vuedemo项目简单的功能 2.10 Vue以及VueCLi运行机制的分享 3. Ant Design Vue学习分享 3.1 介绍 3.2 环境搭建 3.3 官方文档如何看 3.4 性能测评 3.5 如何嵌套其它非Vue页面 3.6 如何自定义封装标签例子 3.7 前后端分的离数据怎么交互 4. VUE2.0学习路线分享

ant-design-vue table 添加合计行

u010737799的博客

02-21

1731

ant-design-vue 添加合计行

vue+ant-design小结

sinat_41746597的博客

08-26

1152

小结

ant-design-vue table表格添加合计行(完美解决篇)

by254484的博客

10-17

7930

ant-design-vue table表格添加合计行解决方案

Ant Design Pro 运用点滴 [1]

AntDz 编程札记

07-24

827

前些天，尝试了一下vue以及element样式。现在要尝试一下阿里的Ant Design Pro。可能是官方文档写得过于简洁，OR本人在前端上不太精通的缘故。费劲不少，成果不大。暂将学习的一些体会记录一下。做为前端的大部份数据都要从后端调取，因为我一上来的学习就向这个方面倾斜。新建菜单项这个在/src/common/menu.js里进行添加。 /**省略*/ { na...

基于springboot，ant-design-vue-pro的简易后台管理系统+源代码+文档说明

11-28

基于springboot，ant-design-vue-pro的简易后台管理系统全部资料+详细文档.zip

12-04

基于springboot，ant-design-vue-pro的简易后台管理系统全部资料+详细文档.zip 【备注】 1、该项目是个人高分项目源码，已获导师指导认可通过，答辩评审分达到95分 2、该资源内项目代码都经过测试运行成功，功能ok的...

Ant Design 使用小结

cxs812760493的博客

03-05

109

https://www.cnblogs.com/wx1993/p/6511389.html

前端优化你必须掌握的知识点，AntDesign大佬总结值得收藏

_web_Z的博客

07-05

163

1.按需加载组件 2.按需加载图标 bunlde size too large 集中管理所有所用到的图标弊端：手动添加 3.按需加载moment，手动引入默认英文，手动引入中文包 4.按需加载echarts 假如我们只使用了柱状图，只需单独引入柱状图即可 ...

AntDesign 组件日常使用踩坑事项（一）

qq_41224332的博客

01-25

370

AntDesign 组件日常使用踩坑事项（一）众所周知，Table组件中设置rowSelection属性，表格首列会变成联动多选（单选）框。 Table组件一定要设置rowKey rowKey可以设置成数据的某个字段，但一定要唯一。不设置或不唯一会造成选择框异常，如选择单行会变成全选。 <Table columns={columns} rowKey={id} onChange={this.handleTableChange}/> ...

js日期控件遇到的问题

weixin_41455340的博客

12-24

885

如图，需要选择日期，筛选出合适的人数 js脚本如下：然后传值，点击查询按钮脚本运行后，页面写入日期成功，提交查询，提示：请输入日期！也就是日期没有传入成功，如图问题定位： 1.被修改的元素对不对修改的元素定位正确 2.输入的日期格式对不对与手动输入的对比，确实不对修改后，执行依然提示：请输入日期 3.找前端，确认日期输入的触发条件需要日期输入框先模拟一个点击事件，才能js操作输入日期，进行查询 #只为记录菜鸟怎么一步步养成定位问题的思路...

datepickview字体设置为白色

HC_DS的博客

07-04

864

关于传值问题上个demo已经差不多应用大部分逆向传值了这篇说一下特殊的dataPickerView 有的时候客户的要求背景很暗但是这个控件的颜色就是黑色不好更改下面来说一说怎么更改成白色 self.view.backgroundColor = [UIColor blackColor]; UIDatePicker *datePick = [[UIDatePicker al

antd中的input和select常用属性整理

hole_diss的博客

11-20

843

表单中input和select是使用频率最高的两个输入控件

a-date-picker 修改placeholder文字颜色

m0_73008551的博客

12-04

467

placeholder="请选择日期"

日期框内容颜色修改

m0_56552153的博客

08-09

616

日期框内容颜色修改日期框 <span class='dateRange'> <el-date-picker v-model="startAndEndDate" range-separator="-" disabled :default-time="['00:00:00', '23:59:59']" :start-placeholder="$t('log.star

TimePicker和DatePicker修改文字颜色

阳光玻璃杯

10-25

6552

使用TimePicker和DatePicker的时候，发现不能设置二者的文字颜色，颜色总是黑色，找来找去也找到设置文字颜色的接口，最终google到了结果，发现很好使，特做记录。 <TimePicker android:theme="@style/MyTimePicker" android:id="@+id/sys

ant-design-vue a-date-picker去掉外框变蓝

qq_39273455的博客

11-28

1586

ant-design-vue a-date-picker去掉外框变蓝 a-date-picker在选完两个日期后，外框会聚焦变蓝还会出现移上去不变蓝，移出变蓝的问题感觉不是直接通过css控制的，很困惑感觉是下面这个控制的，更改了源码还是没改掉解决：改了一通，还修改了源码最后发现在下图这一层的hover和focus这两个状态下会出现蓝框，但是css代码中根本找不到蓝色的属性，后来在...

ant-design-vue 插槽写法

08-16

在 Ant Design Vue 中，插槽的写法略有不同。Ant Design Vue 提供了一些组件，例如 `<a-button>` 和 `<a-modal>`，可以使用插槽来自定义组件的内容。下面是一个示例，展示了如何使用插槽来自定义 `<a-button>` 的...