蔡定努
人前拼实力,人后拼努力
展开
-
elementui-admin 中控制权限菜单三种方式
一、前端配置该方法是elementui-admin默认使用的方法 { path: '/', component: Layout, redirect: '/dashboard',meta : { roles: ['admin','editor'] title: 'title' icon: 'svg-name'/'el-icon-x' breadcrumb: false , acti原创 2021-12-05 20:55:13 · 1460 阅读 · 0 评论 -
设置 npm 源为淘宝镜像
因为有些包需要翻墙或者是境外的服务器,所以使用常规的 npm 安装方式有可能安装很慢或者安装失败,所以淘宝就帮我们把一些需要翻墙的包同步到了国内服务器,所以使用淘宝镜像安装速度会很快。有几种方式:一、只是临时使用npm install --registry=https://registry.npm.taobao.org(多个包安装)npm --registry https://registry.npm.taobao.org install express(单个包安装,express 为某个具体包名转载 2021-11-13 23:18:07 · 550 阅读 · 0 评论 -
Vue-Cli 部署页面出现刷新404
需要在路由生成的router/index.js中把mode: 'history' 注释掉即可export default new Router({ // mode: 'history', // 去掉url中的# scrollBehavior: () => ({ y: 0 }), routes: constantRoutes})原创 2021-10-27 00:22:45 · 341 阅读 · 1 评论 -
vue3基本使用
示例一<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>转载 2021-09-25 02:17:27 · 374 阅读 · 0 评论 -
js页面加水印
let watermark = {}/** * * @param {要设置的水印的内容} str * @param {需要设置水印的容器} container */const setWatermark = (str, container) => { const id = '1.23452384164.123412415' // 查看页面上有没有,如果有则删除 if (document.getElementById(id) !== null) { c.原创 2020-10-15 17:29:06 · 339 阅读 · 0 评论 -
在Vue中使用数字动画
1 安装 npm install vue-count-to2 导包 (组件注册)导包 import countTo from 'vue-count-to'3 使用<count-to :start-val="0" :end-val="999999" :duration="1000"></count-to>转载 2020-08-17 10:07:22 · 905 阅读 · 3 评论 -
vue-cli构建ts项目
1、构建项目vue create xxx上面的第一条,也就是 aaa 这一个选项在你第一次创建项目的时候是并不会出现的,只有你第一次创建完成项目后回提示你保存为默认配置模板,下次新建项目的时候就可以使用你选用的配置快速新建项目了,不需要再重新选择配置项目了。第二条选项便是 vue cli 3 默认的项目模板,包含 babel 和 eslint。第三条选项便是自主选择你项目所需的配置。这里由于默认模板没有啥展示的必要所以我们便选择手动配置。选择项目配置这里我们可以选择我转载 2020-08-07 23:21:53 · 1529 阅读 · 0 评论 -
vue-cli 项目部署到nginx(部署到其他web服务器同理)
原创 2020-07-11 14:23:06 · 403 阅读 · 0 评论 -
vue、js采坑之数据深拷贝
背景在vue或js页面传递数据的过程中,传递数据的引用地址并不会改变,所以当我们改变一些数据时,源 数据也会随之改变。可是有很多情景,我们改变传递的数据,并不需要源数据值发生变化,这时我们就需要对数据进行处理,使数据的引用地址发生变化,即重新生成一个数据拷贝。方法使用JSON方法将数据解析成字符串,之后再转换成JSON对象数据,obj是传递的对象 JSON.parse(JSON.stringify(obj)) 列子: let a = { name.原创 2020-07-08 17:14:24 · 630 阅读 · 0 评论 -
vue require引入文件夹下所有js文件
const modulesFiles = require.context("./modules", true, /\.js$/);// you do not need `import app from './modules/app'`// it will auto require all vuex module from modules fileconst modules = modulesFiles.keys().reduce((modules, modulePath) => { .转载 2020-06-22 11:15:23 · 5418 阅读 · 1 评论 -
vue-element-admin 实现动态路由(从后台查询出菜单列表绑定侧边栏)
1. 在路由实例中保留基础路由router/index.js中只需要保留基础路由,其他的都删了2. 获取用户菜单,并保存到Vuex中stroe/modules/user.js中,有个getInfo方法查询用户基本信息,返回了用户的菜单列表import { login, logout, getInfo } from '@/api/user'import { getToken,...转载 2020-04-28 14:04:10 · 10814 阅读 · 10 评论 -
阿里图标素材在vuecli中的使用(.svg方式)
1、在vuecli的src下创建icons文件夹,子目录svg,用于存放阿里的.svg图标文件package.json中安装: svg-sprite-loader2.svg 目录主要用于存放 svg 文件,来看一下 index.js 的内容,功能就是把组件注册到全局,方便使用:在src/icons/index.js中使用webpack的require.co...转载 2020-04-25 14:53:58 · 866 阅读 · 0 评论 -
clipboard实现复制功能
<template> <div class="hello"> <el-button type="primary" id="copy" @click="copy" :data-clipboard-text="copyContent">复制</el-button> </div></template&g...原创 2020-04-17 20:45:45 · 1194 阅读 · 0 评论 -
vue-cli3 快速配置多环境变量
vue-cli3 搭建的项目其实看起来比 cli2 简单明了很多,官方也有相关文档对多环境变量配置的描述。https://cli.vuejs.org/zh/guide/mode-and-env.html1.首先:通过为 .env 文件增加后缀来设置某个模式下特有的环境变量通过传递 --mode 选项参数为命令行覆写默认的模式在项目的根目录新建3个文件夹,分别对应开发(dev),测试(...转载 2020-04-17 15:43:46 · 725 阅读 · 0 评论 -
axios封装,使用拦截器统一处理接口
最近从0开始搭了一个vue-cli的项目, 虽然axios也可以直接拿来用,但是对接口比较零散,不太好进行维护,也会产生大量的重复代码,所以笔者对axios进行了统一接口处理,废话不多说,直接上代码。首先,在vue-cli项目的src路径下新建一个axios文件夹,在axios文件夹里新建aps.js和request.js,api.js用于写接口,对axios的封装写在request.j...原创 2020-04-17 15:03:36 · 590 阅读 · 0 评论 -
Vue事件处理和当前对象
事件处理和当前对象1、获取当前对象<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="https://cdn.bootcss.com/vue/2.6.11/vue.min.js"><...原创 2020-04-12 23:49:32 · 129 阅读 · 0 评论 -
vue中export和export default的使用
1 export的使用比喻index.js要使用test.js中的数据首先在test.js文件中进行导出操作在index.js文件进行导入操作第一种方法:此时的输出结果是:注意:export 不能直接写成这样子 export{ "":"" // 这样会报错 ....}2 export default的使用test.js文...转载 2020-04-11 00:31:25 · 3509 阅读 · 0 评论 -
uniapp数据更新页面视图不更新
在watch函数中监听数据的变化,然后改变需要刷新的视图绑定的显示与否的关键字,强制重新渲染<template v-if="update"> <!-- 单选 --> <radio-group v-if="data.question.type==1" name="answer" @change="addAnswer"> <...原创 2020-03-23 23:36:03 · 10467 阅读 · 0 评论 -
Vue 中的select默认选中
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <script src="js/vue.js" type="text/javascript" charset="utf-8"></script>...原创 2020-01-05 02:13:58 · 660 阅读 · 0 评论 -
axios请求封装
import {Message} from 'iview';import {Modal} from 'iview';// 配置API接口地址(加上export其他组件才能使用)export const serverIp = 'http://127.0.0.1:82';// 引用axiosconst axios = require('axios');// 自定义判断元素类型JSfu...原创 2019-12-20 22:18:18 · 194 阅读 · 0 评论 -
Vue中前后端分离 出现跨域session不是同一个(跨域)
后端:package com.example.mybatisplustest.config;import org.springframework.context.annotation.Configuration;import org.springframework.web.servlet.config.annotation.CorsRegistry;import org.spring...原创 2019-12-20 22:17:45 · 1090 阅读 · 0 评论 -
vue-router传递参数的几种方式
...原创 2019-12-15 00:32:31 · 145 阅读 · 0 评论 -
vue.js的生命周期函数执行流程
原创 2019-02-17 17:13:58 · 400 阅读 · 0 评论 -
VUE全局监听键盘事件
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <script src="js/vue.js" type="text/javascript" charset="utf-8"></script> <script src="https://cdn.st...原创 2019-03-26 16:00:11 · 9004 阅读 · 0 评论 -
npm和cnpm(windows)安装步骤
一、什么是npm和cnpmnpm(node package manager):nodejs的包管理器,用于node插件管理(包括安装、卸载、管理依赖等)cnpm:因为npm安装插件是从国外服务器下载,受网络的影响比较大,可能会出现异常,如果npm的服务器在中国就好了,所以我们乐于分享的淘宝团队干了这事。来自官网:“这是一个完整 npmjs.org 镜像,你可以用此代替官方版本(只读),同步频...转载 2019-05-31 10:53:02 · 273 阅读 · 0 评论 -
vue设置一开始进入的页面
vue项目默认进入的页面是HelloWorld.vue现在我们创建一个页面Login.vue<template> <div>登录界面 </div></template><script type="text/ecmascript-6"> export default { data() ...转载 2019-05-31 13:35:29 · 9665 阅读 · 1 评论 -
vscode集成git
原创 2019-09-07 00:51:05 · 223 阅读 · 0 评论 -
Vue.js——60分钟快速入门
Vue.js是当下很火的一个JavaScript MVVM库,它是以数据驱动和组件化的思想构建的。相比于Angular.js,Vue.js提供了更加简洁、更易于理解的API,使得我们能够快速地上手并使用Vue.js。本文摘自:http://www.cnblogs.com/keepfool/p/5619070.html如果你之前已经习惯了用jQuery操作DOM,学习Vue.js时请先抛开手...转载 2019-01-09 10:56:18 · 140 阅读 · 0 评论