ant-design-vue
搬砖工KO水泥匠
一枚搬砖的仔,一个粉刷的匠。
展开
-
Ant design vue 2.x 版本在 vue3 中的主题定制
Ant design vue 2.x 版本在 vue3 中的主题定制我们是在vue3.0 项目中使用 ant design vue 2.0,解决流程和官网思路一致,直接使用 less 变量层叠即可,但是有一个问题就是需要全量引入 style 文件。具体如图展示main.jsimport { createApp } from 'vue';import router from '@/router';import App from './App.vue';import { Cascader原创 2021-05-13 09:54:58 · 714 阅读 · 0 评论 -
vue3 中 watch 监控当前 router
vue3 中 watch 监控当前 router需求:在开发过程中,router 匹配当前导航栏,并将指定导航栏进行高亮显示。主要问题:实时获取当前路由数据,实时更新数据 selectedKeys解决方案:使用vue3中的 useRouter 进行判断匹配,使用 watch 进行监控,代码如下<template> <div> <span>{{ selectedKeys }}</span> </div></temp原创 2021-05-11 11:11:47 · 4198 阅读 · 0 评论 -
VUE3 中使用 VUEX,报错【[Vue warn]: inject() can only be used inside setup() or functional components.】
VUE3 中使用 VUEX,报错【[Vue warn]: inject() can only be used inside setup() or functional components.】参考链接1:参考链接 vuex 报错 injuce() 参考链接2:vuex 报错 无法在methods中使用store的引入因为在setup中,已经对store进行了定义,所以不能再在外边的methods中进行访问javascript fail···import { useStore } fro原创 2021-04-02 10:25:50 · 13019 阅读 · 1 评论 -
使用 vue-smooth-dnd 进行拖拽排序
HTML<template> <div class="simple-page"> <div>11111111111111</div> <Container @drop="onDrop"> <Draggable v-for="item in list" :key="item.id"> <div class="draggable-item"> <span原创 2021-01-13 00:30:51 · 1142 阅读 · 0 评论 -
ant design vue 中 table row 单行高亮样式展示
ant design vue 中 table row 单行高亮样式展示template<a-table ref="table" :rowKey="record => record.enrollment.enrollment_no" :columns="columns" :data-source="data" :showHeader="false" :loading="loading"原创 2020-12-01 17:59:47 · 1028 阅读 · 0 评论 -
vue 中 input 自动获取焦点
template<!-- 增加标签 对话框 --> <a-modal :title="ModalText" :visible="visible" :confirm-loading="confirmLoading" @ok="handleOk" @cancel="handleCancel" > <a-input size="large" placeholder="请填写···" v-mode原创 2020-09-01 10:44:55 · 937 阅读 · 0 评论 -
Ant-design-vue中的选择时间控件 a-date-picker ,设置不能选择距今十年内的时间
template<a-form-model-item label="出生日期" prop="birthday"> <a-date-picker class="detail" @change="onChangeTime" placeholder="" :inputReadOnly="false" :showToday="fals原创 2020-08-25 14:12:48 · 1557 阅读 · 0 评论 -
expandIconColumnIndex、expandIcon,使用ant design中 expandedRowRender 展开额外行自定义图标位置和样式
<template> <a-table :columns="columns" :data-source="data" :expandRowByClick="false" :expandIconAsCell="false" :expandIconColumnIndex="4" :row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"原创 2020-08-23 22:49:32 · 6544 阅读 · 1 评论