标签:Vue

antd如何实现table表格的rowspan、colspan行列合并

表格在前端开发用的非常多,最近一直在用antdesign开发vue项目,有一个需求就是要实现表格行合并,查看官网发现实现table表格的rowspan、colspan行列合并的案例代码如下:<template> <a-table :columns="columns" :data-source="da……

typescript any类型不建议使用,如何查找第三方库的对应类型?

在使用typescript开发时,经常会使用any类型,因为很方便,任何类型都能接收,尤其是对第三方库里面的数据类型,只要使用any,任何问题都解决了!但是,我们不建议使用any类型!什么是 any?any不是通配符,也不是基类型,它是明确地与第三方库进行交互。any 类型可让代码在编译期间逐渐选择加入和选择退出类型检查机制。使用 any 可能允许我们在不……

antd table如何实现column列前后端排序

antd table组件的功能非常强大,可以实现根据column列进行前端和后端排序、筛选等功能,下面潘老师给大家介绍下antd table如何实现前端排序和服务端排序的问题。一、前端排序antd table前端排序其实非常简单,我们先看下column列官方API说明:所以想要实现前端排序,只要在定义column列时,设置sorter属性,再带个回调……

Vue3中的watch和computed的使用方法详解

现在很多web前端项目开使用vue3开发,而对潘老师这中专注于Java后端开发的程序员而言,之前也只学过vue2.x,现在是前后端兼顾,最近有个功能要用到watch监听器和computed计算属性,但是用法和vue2还是有区别的,下面潘老师对Vue3中的watch和computed的使用方法做下记录,方便以后使用。computed使用// 模板代码……

npm run serve提示error Mixed spaces and tabs no-mixed-spaces-and-tabs解决办法

今天在vscode中修改了部分vue代码,然后保存重新npm run serve就提示如下错误:具体如图:看这个错误提示意思就是“不允许代码中出现空格和tab键混合的情况”大多数代码约定要求使用空格或 tab 进行缩进,禁止使用空格和tab混合缩进。因此,一行代码同时混有 tab 缩进和空格缩进,通常是错误的。原因找到了,解决办法就是找到space……

antd实现select下拉框带有搜索筛选功能报错option.children.toLowerCase is not a function

最近在被安排去做前端开发,由于下拉框中的数据可能太多,滚动一个个翻着来查找影响效率,因此需要实现下拉框带有根据输入进行筛选的功能,由于本项目是用ant design开发的,而antd官网上针对下拉框Select组件也有此功能的实现,具体代码案例如下:<template> <a-select show-search ……

推荐几款非常好用的Vue后台管理UI框架和移动端UI组件库

你还在自己手撸后台管理页面吗?你还在为用什么配色而烦恼吗?你还在为手机端适配而纠结吗?速来看看下面潘老师给你推荐的几款基于Vue开发的后台管理UI框架和移动端UI主题,让你不再为前端开发而苦恼,直接开箱即用,立马写出高逼格的后台页面和炫酷的移动端页面。一、后台管理UI框架NO.1 Element PlusElement Plus,一套为开发者、设计师和……

npm install报错npm ERR! cb() never called问题解决办法

从git上pull拉下来一个vue项目,在执行npm install竟然报错如下:具体如下图:从网上找了些办法,一种是删除node_modules和package-lock.json然后重新npm install结果发现不行,仍然报这个错,于是换了一个稍微复杂的方法,成功解决,具体操作如下:方法1:成功率一般第1步:清缓存首先我们以管理员身份打开……

如何使用v-model实现双向绑定vuex的state

有时候我们需要使用v-model实现对vuex的state中数据的双向绑定,我们该如何实现呢?我们的html代码如下:<div id="app"> 用户名:<input type="text" v-model="username" /></div&……

vue-router路由拦截实现将未登录请求跳转到登录页面

我们在使用vue-router开发前端项目时,经常需要保证有些页面不需要登录就可以访问,但有些页面必须登录后才能访问,那我们该如何才能方便地实现这样的需求呢?其实,使用vue-router中的路由拦截可以轻松实现一些收保护的页面如果在未登录状态下被请求访问,可以直接跳转到登录页面。我们实现如上需求只需要两个步骤:1)在router目录下的index.js……

使用ElementUI实现简单的后台管理首页布局

在使用ElementUI实现后台管理首页布局是比较常见的一个需求,下面潘老师就带大家来实现简单的后台管理布局。我这里使用的是vue-cli脚手架整合ElementUI来搭建的环境,如果你还不会整合请参考博文:第1步:实现如图整体布局1)首先我们在components文件夹中新建一个Home.vue组件,作为我们的后台管理首页组件,我们参考Element……

vue手机商城项目实战(10)-购物车组件实现

一、素材准备1、在购物车中没有商品时,显示购物车为空图片,图片下载:2、解压后上传至assets\img目录下二、购物车组件实现修改Shopcar.vue如下:<template> <div id="shopcar"> <!-- 顶部导航栏 --> ……