VUE
关注
分享
扫一扫
作者尤雨溪，
是一套用于构建用户界面的渐进式框架。
邬羽
会写一点点代码。
展开
-
Vue.js ：使用LODOP打印表格文件
用到的打印工具是LODOP。项目环境是vue-cli搭建的，组件库是ant design vue。1、在需要打印的页面引入插件。<script> import { getLodop } from '@/utils/LodopFuncs'</script>2、绘制要打印的表格内容此处不要用组件库的<a-table>去写，用原生的<table> <caption> <tr> <th> <td>等标签去原创 2020-10-12 16:34:42 · 1590 阅读 · 0 评论 -
Vue.js：时间格式化
项目中经常遇到这样的场景，后端在接口中返回的时间信息是时间戳，需要前端处理好再展示。需要用到moment包，先安装好，引入。<script>import moment from 'moment';</script>html中的时间格式化<p>{{info&& info.createTime | timeFilter}}</p>export default { filters: { timeFilter(.原创 2020-08-20 16:41:02 · 1085 阅读 · 0 评论 -
Vue.js ：解决引用图片地址返回403的问题
index.html<!DOCTYPE html><html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="referrer" content="no-referrer" /> <title>index&.原创 2020-08-19 11:00:20 · 1633 阅读 · 1 评论 -
Ant Design Vue ：table 组件 自定义分页器、排序、插槽使用
Ant Design Vue 是蚂蚁金服推出的后台服务组件库，目前有62个开箱即用的高质量 Vue 组件。后台管理应用中，table和form表单的使用场景比较多，于是做一下table组件的使用总结。一、table组件官方文档地址二、举个栗子，定义一个带分页器的table组件： <a-table ref="table" :columns="columns" :dataSource="lists" :pagination="pagination" @chan..原创 2020-07-02 13:04:39 · 12418 阅读 · 3 评论 -
浏览打包好的文件：npm包serve的使用
项目代码打包好之后，直接打开index.html文件是无法运行和浏览的，除非将打包好的代码部署到服务器上，那前端如何查看打包好的文件呢？可以使用serve命令来完成。安装serve包npm i serve -g //全局安装npm i serve --save //局部安装举个栗子，当一个vue工程打包好之后，进入到根目录【不要进入dist文件夹】serve dist即可得到本地预览地址咯。...原创 2020-06-19 17:28:00 · 2249 阅读 · 0 评论 -
Ant Design Vue 菜单刷新后保持菜单选中/点击菜单，收起其他展开的所有菜单，保持菜单聚焦简洁
1、在刷新后保持菜单选中ANTD的API中提供了一个defaultSelectedKeys参数描述：初始选中的菜单项 key 数组类型： string[] 自己手动实验得知意思就是在数组中填入字符串 例如[‘key’]默认值为空在菜单标签中设置 defaultSelectedKeys属性指向this.$route.path即可2、点击菜单，收起其他展开的所有菜单，保持菜单聚焦简洁<template> <div> <a-menu mode="inline原创 2020-06-17 16:07:27 · 7440 阅读 · 0 评论 -
Ant Design Vue LocaleProvider国际化组件zh_CN中文配置
举个栗子，我在项目中遇到了一个问题，table组件的分页器页数默认显示为英文，查了一下，可以用<a-locale-provide>标签去实现，使用过程中发现这个标签已经废弃，于是总结出以下方法：// App.vue<template> <div> <a-config-provider :locale="locale"> <div id="app"> <router-view />原创 2020-06-16 09:14:05 · 4819 阅读 · 4 评论 -
Vue.js —— 解决跨域问题
开发环境一般要跨域，解决跨域问题，要设置代理，在vue-cli 3下 package.json 同级目录新建一个 vue.config.js 文件，加入下面代码，其他版本找到配置文件的devServer加入代码：module.exports = { //axios域代理，解决axios跨域问题 devServer: { proxy: { ...原创 2019-09-19 14:22:14 · 530 阅读 · 0 评论 -
Vue.js —— 页面跳转
<router-link></router-link>标签跳转JavaScript中设置跳转<router-link></router-link>标签跳转<router-link to="/home">Home</router-link>JavaScript中设置跳转占位符 paramsthis.$router.p...原创 2019-09-11 16:06:09 · 274 阅读 · 0 评论 -
Vue.js —— Vue Cli3构建Vue+ant design vue项目
Vue Cli3构建Vue+ant design vue项目编辑器需添加插件：浏览器需添加插件：编辑器需添加插件：前提：我使用的是vs code编辑器。1、beautify——代码格式化。2、vetur——支持.vue文件的语法高亮显示、自动完成等。浏览器需添加插件：vue-devtools —— vue-devtools是一款基于chrome游览器的插件，用于调试vue应用，这可以极...原创 2019-09-06 13:07:45 · 6975 阅读 · 0 评论 -
vue入门：为什么使用v-for的时候必须要添加唯一的key？
v-for中的key使用v-for更新已渲染的元素列表时,默认用就地复用策略;列表数据修改的时候,他会根据key值去判断某个值是否修改,如果修改,则重新渲染这一项,否则复用之前的元素;我们在使用的使用经常会使用index(即数组的下标)来作为key,但其实这是不推荐的一种使用方法;举个例子：const list = [ { id: 1, name: ...原创 2019-05-05 16:42:55 · 11959 阅读 · 1 评论 -
Vue.js —— 使用ant design vue时无法加载less-loader/less模块
问题来源：ant design vue的issues https://github.com/vueComponent/ant-design-vue/issues/234问题产生原因：如果安装vue-cli3，再引入ant design vue UI组件的话会产生这个错误。解决办法：1、降级vue-cli3 ，举个栗子，降到2.2.1npm install vue@2.2.1 -...原创 2019-09-04 11:04:27 · 4481 阅读 · 3 评论 -
Vue.js —— 获取按键修饰符keyCode
在表单的输入和提交操作中，内容的复制粘贴操作等，都需要使用到一些特定的按键。常用的按键码如下：.enter.tab.delete (捕获“删除”和“退格”键).esc.space.up.down.left.right.ctrl.alt.shift.meta举个栗子：// 按空格键触发Dosomething事件<input type="text" @k...原创 2019-09-03 14:33:05 · 3640 阅读 · 0 评论 -
[Vue warn]: Error in created hook: "TypeError: handler.call is not a function"
报错内容：报错原因：没有正确使用vue的声明周期钩子函数，正确写法：created(){},错误写法：created:{},原创 2019-09-03 13:54:54 · 8270 阅读 · 2 评论