vue_study
关注
分享
扫一扫
中原猪精
这个作者很懒，什么都没留下…
展开
-
vue 一个超级简单的无缝图片滚动
由于项目需要，我的滚动不设置自动滚动，不设置定时，添加定时也不难，在调用滚动函数的时候加个定时就ok项目大概如下：点击左右箭头实现无缝滚动设计思路：点击左箭头，数组首元素添加到最后一个并删除；点击右箭头，数组最后尾元素添加到第一个并删除代码如下template部分script部分clickLeft(){ let direction = 'left' this.scrollImg(direction)},clickRight(){ le原创 2020-11-11 17:43:51 · 3680 阅读 · 1 评论 -
quasar中使用validator自动校验（笔记）
1.用自己熟悉的安装工具安装2.挂载到vue上，我放置的目录如下挂载代码如下import VeeValidate from 'vee-validate';Vue.use(VeeValidate);3.自己定义贴合项目的词典和规则（配置vee-validate）我的配置文件放置位置配置代码import VeeValidate, { Validator } from 'vee-validate'import zhCN from 'vee-validate/dist原创 2020-11-06 11:21:08 · 1662 阅读 · 0 评论 -
百度小程序登录获取用户信息过程（笔记）
百度小程序的登录流程与微信小程序相同，接下来捋一捋整个过程1.login获取code，前端获取到code交给后端，后端处理拿到session_key后端用的nodejs框架thinkjs写的，获取session_key接口为getSecssionKeyAction()，nodejs的其他框架也可以这样const Base = require('../base.js');const axios = require('axios');module.exports = class e.原创 2020-10-26 14:56:04 · 3164 阅读 · 1 评论 -
uniapp对unirequest的简单封装（笔记）
一、我的测试api以及它的返回数据二、新建lib目录放配置文件，新建request.js封装uni-request// 封装uni-requestimport uniRequest from 'uni-request';let baseURL = 'http://127.0.0.1:8364'function request(options) { let headers = { "Content-Type":"application/json" }原创 2020-10-23 14:31:53 · 590 阅读 · 0 评论 -
quasar中axios的封装、拦截器、token刷新（笔记）
一、封装axios请求import libAxios from 'axios'// axios网络请求封装请求开始const axios = libAxios.create({ baseURL: process.env.API_ROOT, timeout: 15000, withCredentials: false, headers: { 'Content-Type': 'application/json;charset=utf-8', 'Access-Contro原创 2020-10-23 10:35:49 · 2962 阅读 · 0 评论 -
quasar 路由笔记
quasar与vue-cli相似，在这里整理一个关于quasar路由的笔记一、路由配置实现页面跳转1.quasar的文件大概如下，我的路由配置放在router目录里2.这里我配置两个路由，首页home、登录页login，首页配置在文件static.js里，登录页配置在root.js里。首页statics.jsexport default [ // 首页 { name: 'home', path: '', component: () => imp原创 2020-10-22 17:35:55 · 2655 阅读 · 0 评论 -
在uniapp自定义组件中使用uchart时遇到的数据更新问题
需求：选择不同月份显示相应月份的图表。遇见问题：数据能够成功更新，但图表不能随数据渲染，需要在页面点击才能实现。思考：先拿到数据，再对图表进行渲染。结合组件生命周期函数：https://www.cnblogs.com/qidh/p/11431998.html实现切换日期显示相应图表需要watch监听...原创 2020-09-27 16:29:29 · 3164 阅读 · 0 评论 -
uniapp|微信小程序实现悬浮按钮单双击
需求：点击悬浮按钮，菜单栏出来时，图表右移，再次点击菜单栏收回，图表回原位设置unifab的单双击，实现思路，定义“touchStartTime：0”为点击次数，点击一次加1，判断touchStartTime余2，值为1为单击，值为0为双击html代码<view class="segment"> <uni-fab :pattern="pattern" :content="cont.原创 2020-09-25 14:18:50 · 1572 阅读 · 0 评论 -
在vue列表渲染中使用鼠标移入移出
列表渲染中想实现鼠标移入移出功能，如下图：问题出现：定义了一个desc_show,直接在移入移出函数中写desc_show=true/desc_show=false。结果出现鼠标移入特定元素，其他不该出现的元素也出现，这不是我想要的。解决办法：利用循环中的index，现在移入移出函数中赋值，再到需要显示的元素中进行三目运算。定义desc_show为空将index传入在函数中对desc_show赋值（赋值可以是数组里的任意一个）在需要出现的元素中添加三目运算进行判定..原创 2020-08-10 11:15:50 · 860 阅读 · 0 评论 -
vue——错误记录：You may have an infinite update loop in a component render function.
想法是将不同页面动态存储在localStorage的数组渲染到另一页面然后出错~~~~~~~~~~~~~~~~~~尽管知道怎么回事，就是v-for循环中，不能对循环的数组里的对象的数组进行操作，也就是不能对datas的值改变，但还是懵后来我仔细用我笨拙的脑袋抠脚一想，想了一个办法，虽然还是报错但能成功渲染出来。。。我得继续抠脚想想怎么把错误干掉，记录一下~~~...原创 2020-07-23 15:01:48 · 22587 阅读 · 2 评论 -
vue/cli——todolist待办事项
重新再做一次这个案列，我尝试着结合antd组件，简单的antd能显示出来。比之前做的多了删除、编辑、还有localStorage存储数据，刷新时不至于列表为空。整个项目完成后测试如图：1.localStorage封装export function setItem (key, value) { localStorage.setItem(key, JSON.stringify(value))}export function getItem (key) { return JSON..原创 2020-07-07 08:21:27 · 403 阅读 · 0 评论 -
axios封装登录拦截错误记录
出现一个错误，纠结许久。。后来发现，引入文件时我多加了一对大括号去掉大括号就可以了原创 2020-07-03 22:20:24 · 136 阅读 · 0 评论 -
记录一次vue-element-admin安装依赖包出错
基本总结出一句话：不用cnpm，会漏装！会漏装！用npm装。给vue-element-admin使用cnpm install安装依赖包总是出错，安装包下到半路就报busy错误我看了npm配置发现之前安装的淘宝镜像没了重新安装npm install -g cnpm --registry=https://registry.npm.taobao.org再执行cnpm install依赖全部安装成功但是又有问题了，依赖虽然全部安装了，运行项目时还是报错这说明cnpm并没有把所有.原创 2020-06-16 11:25:14 · 1481 阅读 · 1 评论 -
vue-cli+express+mysql简易聊天项目
项目地址：https://github.com/woliwl/vue项目介绍1.登录页面，登录效果没写出，直接点击角色实现登录2.好友展示页面3.单聊4.群聊5有一些细节地方比如在线好友给离线好友发消息，未读消息的红点显示，以及同一用户不能再两个地方同时登录等...原创 2020-06-10 16:44:33 · 209 阅读 · 0 评论 -
vue项目实战：共享单车后台管理
链接地址：https://download.youkuaiyun.com/download/qq_42257997/12485131vue-cli框架、使用百度地图api、定位&添加图标、反向代理解决跨域问题、mint-ui美化页面实现效果点击故障单车页面跳转原创 2020-06-01 16:07:35 · 1107 阅读 · 0 评论 -
Vue-cli使用百度地图Api
1.申请百度地图ak：http://lbsyun.baidu.com/apiconsole/key#/home点击创建应用：2.在index.html里引入百度地图脚本<script type="text/javascript" src="http://api.map.baidu.com/api?v=3.0&ak=你的密钥"></script>3.在地图组件map.vue里初始化地图<template> <div class="原创 2020-05-30 14:02:06 · 1084 阅读 · 0 评论 -
记录：用vue-cl以及vuex做一个简单的事件记录表（todos）
这是一个简单的vue小案列，用来练手的，地址：1.搭一个总体的框架出来，类似下图文件components下建立三个组件，然后在router文件下配置组件的路由路径import Vue from 'vue'import Router from 'vue-router'//配置路由import All from '@/components/all'import Active from '@/components/active'import Complete from '@/c.原创 2020-05-30 12:05:52 · 333 阅读 · 0 评论 -
笔记：vue应用之搜索框功能实现
列表渲染+计算属性实现搜索框功能<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <script src="js/vue.js" type="text/javascript" charset="utf-8"></script> </head> <body> <div i原创 2020-05-20 16:18:48 · 757 阅读 · 0 评论