vue
天宇流沙
这个作者很懒,什么都没留下…
展开
-
promiseAll方法
promise.all原创 2023-01-31 15:02:20 · 108 阅读 · 0 评论 -
Git 操作场景大全
Git 命令大全原创 2022-11-14 11:35:29 · 847 阅读 · 0 评论 -
js监听div滚动条
js监听div滚动条原创 2022-10-18 17:14:51 · 5317 阅读 · 0 评论 -
js原生的头像修改
头像修改vue原创 2022-07-12 19:27:24 · 544 阅读 · 0 评论 -
git提交代码绕过语法检测及单行绕过
git commit --no-verify -m “首页修改”原创 2020-12-16 16:23:50 · 1221 阅读 · 1 评论 -
vue监听表格滚动条
原创 2022-04-19 08:02:41 · 924 阅读 · 0 评论 -
vue购物车计算商品总价带金额千分位
<div>总计{{totalPrice}}</div> this.list=[ {price:30,num:32,name:'book'}, {price:20,num:12,name:'apple'}, {price:10,num:31,name:'coffee'}, ] computed:{ // 总价 totalPrice(){let total=0;for(let i=0;i<.原创 2021-12-26 21:26:01 · 502 阅读 · 0 评论 -
echartsdemo
// 监控区域模块制作(function() { $(".monitor .tabs").on("click", "a", function() { $(this) .addClass("active") .siblings("a") .removeClass("active"); // console.log($(this).index()); // 选取对应索引号的content $(".monitor .content".原创 2021-09-13 19:54:25 · 1255 阅读 · 0 评论 -
js判断移动端是安卓还是苹果手机
if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) { //alert(navigator.userAgent); alert('ipone')} else if (/(Android)/i.test(navigator.userAgent)) { //alert(navigator.userAgent); alert('安卓')} else { alert(3)};原创 2021-08-30 16:38:04 · 197 阅读 · 0 评论 -
设置antdesign-vue表格滚动条在最上方(吸顶)
document.querySelector('.ant-table-body').scrollTop = 0原创 2021-08-29 21:36:43 · 3357 阅读 · 0 评论 -
mvvm响应代码
<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>复制粘贴</title></head><body > <div id="app-7"> <h3>{{msg}}</h3> <div v-text='msg'></div> <div v-te原创 2021-08-10 22:19:10 · 143 阅读 · 0 评论 -
antdesign-vue表格table组件列字段筛选
<template> <div class="boxbig"> <div class="mean-content"> <div class="right-btns"> <!-- 按钮 --> <a-button class="table" @click="handleTable"> <a-icon type="table原创 2021-07-25 18:11:04 · 3373 阅读 · 0 评论 -
js给元素加动画闪烁
aa () { setTimeout(this.bb, 500); setTimeout(this.bb, 900); setTimeout(this.bb, 1300); }, bb () { let dom = document.querySelectorAll('.class1')[0]; dom.classList.add('checked-td-of-add-table'); let timer..原创 2021-06-29 23:08:07 · 695 阅读 · 0 评论 -
vue-antdesign文件上传,及vue调用扫码监听回车。
//方案:将流格式的文件传给后端,后端返回可访问的图片地址。再次查询时,按如下格式将后端给的图片放回到组件的filelist里。//上传后查询图片,后端提供接口 getProblemPhoto(this.problemResData.id).then((res) => { console.log(res); this.fileList = res.map((v) => ({ uid: `${v.id}`,//随便写原创 2021-06-20 20:10:35 · 507 阅读 · 0 评论 -
vue使用ref调用子组件内部方法及子组件调用父组件方法,循环清空对象的值。
// 外层父组件,文件一 <van-icon name="cross" @click=" nocheck = false;// x图标关弹窗 $refs.nochecks.resetData();//2.$refs.nochecks调用组件nocheck的方法,清除数据。 " /> <nocheck ref="nochecks" //1。给组件加ref原创 2021-06-20 19:51:54 · 938 阅读 · 0 评论 -
组件内导航钩子
Vue.use(Field);let fromPath = '/';export default { beforeRouteEnter(to, from, next) { fromPath = from.path; next(); },} if (fromPath === '/password-forget') { this.$router.push({ path: '/', });原创 2020-09-07 22:27:54 · 346 阅读 · 0 评论 -
app登录页组件及修改密码组件(fzsc),带一个含图片的input框
<template > <div class="d-flex flex-column align-center page-container"> <div class="avatar-wrapper d-flex align-center justify-center"> <img src="./images/touxiang@3x.png" class="avatar"> </div> <div cl原创 2020-09-07 22:22:41 · 385 阅读 · 0 评论 -
图片上传及预览功能
点击图片和重新上传都能改变图片显示 <van-field> <template #input> <div class="imgbox"> <span slot="label">店铺头像</span> <img class="img" :src="img" @click="uploadimg" /> <van-button.原创 2020-07-17 17:03:06 · 106 阅读 · 0 评论 -
Vant-ui之list组件load五步
async onLoad() { // 异步更新数据 // 1.setTimeout 仅做示例,真实场景中一般为 ajax 请求获取数据 try { const { data } = await getArticle({ type: 'a', source: this.source.toString(), offset: this.offset, limit: this.lim原创 2020-07-09 10:40:26 · 1786 阅读 · 0 评论 -
基于vue脚手架的token验证结合VUEX解决登陆回退
在src下的utils文件夹新建一个js文件(没有就新建)封装三个函数,为删除获取和设置token使用// 封装本地存储操作模板// 储存数据export const setItem = (key, value) => { if (typeof value === 'object') { value = JSON.stringify(value) } window.localStorage.setItem(key, value)}// 获取数据export co.原创 2020-07-01 10:00:30 · 1626 阅读 · 1 评论 -
项目上线优化
1,根目录下新建vue.config.js,配置开发模式和发布模式的打包入口文件。src文件夹下新建main-prod.js和main-dev.js。复制main.js到这2个文件中。删除main.js。2.在vue.config.js中添加externals, 删除main-prod.js(发布阶段)中对应的css样式表,在index.html中添加相应的css连接和js连接(cnd资源),来减少打包时的体积。module.exports = { chainWebpack: config =&g原创 2020-06-26 21:21:12 · 387 阅读 · 0 评论 -
web前端vue项目完整步骤。pc端
这个步骤是源于一个后台的电商管理系统来写的,资源连接:https://download.csdn.net/download/qq_41792374/125508941创建手脚架,可视化安装vue-cli-plugin-element插件,改为按需引入,安装axios依赖2,数据导入mysql,在vue_api——server开终端安装依赖 npm install,然后node app.js 用postman测试接口3,用vscode通过脚手架打开项目,查看工作区是否干净git status 创建登陆原创 2020-06-25 11:05:48 · 2748 阅读 · 0 评论 -
解决msg:token无效
msg:‘无效token’,status:400原因:用第三方组件element-ui或者其他组件的单个功能上传图片,没有用到axios发请求,而是组件内部自己封装了一个ajax去发请求,组件内部封装的ajax不携带Authorization字段.解决方案:1.首先在上传组件中手动添加 :headers:"headerObj"2.再设置上传组件的请求头,添加Authorization字段:就解决了。...原创 2020-06-25 09:08:51 · 11181 阅读 · 0 评论 -
echarts可视化图表五步搞定
1.导入echarts:也可以改为导入js文件import echarts from 'echarts'2.为图表准备盒子,设置id <div id="main" style="width:600px;height:400px;"></div>3.初始化echart实例 var myChart = echarts.init(document.getElementById('main'))4.设置配置项 // eslint-disable-next-line no-原创 2020-06-23 11:20:32 · 1525 阅读 · 0 评论 -
级联选择器简单讲明
级联选择器,重要的是1,:options项是数据源,键名可通过 Props 属性配置。Cascader 的options属性指定选项数组即可渲染出一个级联选择器.label和value,children 属性最为重要原创 2020-06-21 21:21:23 · 3108 阅读 · 1 评论 -
超简单解决token问题和登陆验证回弹问题
1.下图为登录页登陆时,通过window.sessionStorage.setItem携带token2.上图为请求拦截器通过config.headers.Authorization 验证token是否存在,如果不存在,页面内无法向服务器发送请求3.设置路由导航卫士router.beforeEach((to, from, next)。如其他页面不带token.强制弹回登陆页...原创 2020-06-19 09:18:10 · 4744 阅读 · 0 评论 -
Vue作用域插槽简单讲明
1.父组件对子组件加工处理2.组件分作用域插槽,匿名插槽,具名插槽,但是作用域插槽用的最多最广。3.父组件的template标签有一个固定特有的属性,是作用域插槽的灵魂: slot-scope 这个属性可以得到子组件的所有属性(数据)slot-scope=“xxx", xxx保存了子组件所有的属性,xxx可以理解为后台传来的data对象,可以用xxx.属性获取数据xxx名字可以随便取。...原创 2020-06-18 00:27:22 · 158 阅读 · 0 评论 -
后台项目的环境安装配置
后台项目的环境安装配置原创 2020-06-16 07:11:32 · 240 阅读 · 0 评论 -
vue和element-ui前端项目初始化
前端项目初始化步骤原创 2020-06-16 06:59:46 · 353 阅读 · 0 评论 -
vue脚手架安装报错,终极方法
淘宝镜像什么什么错误:request to http://registry.npm.taobao.org/@vue%2fcli failed, reason: getaddrinfo ENOTFOUND registry.npm.taobao.org,reason: getaddrinfo ENOTFOUND registry.npm.taobao.org!报错原因:应该是之前下载包的时候设置了淘宝镜像代理地址,清空一下代理地址就好了。清空代码如下。解决方案:npm config set proxy原创 2020-06-15 09:07:25 · 2863 阅读 · 0 评论