vue
wangc_gogo
一个标点符号一篇博客,也是一种进步!!!
展开
-
springmvc 项目集成vue配置
需要借助freemarker<dependency> <groupId>org.freemarker</groupId> <artifactId>freemarker</artifactId> <version>2.3.28</version></dependency><de...原创 2019-10-25 10:54:55 · 1862 阅读 · 0 评论 -
vue 路由导航
router.beforeEach((to ,from ,next)=>{document.title=to.matched[0].meta.title;next() //必须写,否则无法跳转。})原创 2019-07-01 13:14:29 · 459 阅读 · 0 评论 -
ios 自定义隐藏或显示option
/* * jq对象,要显示那些元素[],要隐藏那些元素[] */function toggleOptionShow(obj,arrShow,arrHide){ function arrHandle(arr,type){ if($.isArray(arr)){ var len=arr.length; for(i=0;i&...原创 2019-07-06 09:36:42 · 748 阅读 · 0 评论 -
ES6 promise 高级用法
在开发中经常遇到,需要经过几次网络请求,且结果都正确才可以执行一下步的操作,在没有es6 promise之前我们通常使用标记来记录状态的方法进行处理,操作相当繁琐且不好控制,ES6 为我们提供了Promise.all()方法,下面是具体的案例:Promise.all([ new Promise(res=>{ setTimeout(function () { r...原创 2019-07-06 09:50:32 · 646 阅读 · 0 评论 -
vuex 是什么?
下面这个图介绍的比较到位:自己也可以封装,但是很难实现响应式处理。转载 2019-07-06 10:07:38 · 122 阅读 · 0 评论 -
vuex 使用及数据格式
mutation主要处理数据的修改getter主要书业务逻辑处理,一般不会改变元数据转载 2019-07-06 10:52:16 · 623 阅读 · 0 评论 -
vuex 对页面状态管理
转载 2019-07-06 10:58:58 · 312 阅读 · 0 评论 -
vuex 状态管理图
原创 2019-07-06 11:10:16 · 959 阅读 · 0 评论 -
谷歌 安装vuex devtools 步骤
chrome浏览器的应用商店不能直接访问(需要跨域),所以直接应用商店安装的方法就行不通了。1、到github主页去下载安装: 1 git clone https://github.com/vuejs/vue-devtools 2、继续执行以下命令(cnpm国内镜像下载更快): 1 2 3 ...转载 2019-07-06 11:35:01 · 8361 阅读 · 0 评论 -
vue 添加购物车 列表无法刷新的问题
由于页面会存在缓存,第一次购物车列表是没有数据的,向购物车添加商品,但是购物车列表还缓存这以前的高度,导致虽然有数据单数无法刷新的问题,如何解决?只需要在activated里面刷新一下即可 this.$refs.scroll.refresh()...原创 2019-07-18 09:09:41 · 876 阅读 · 0 评论 -
vue scroll $bus $emit卡顿问题
在使用betterscroll 在加载含大量图片的情况,由于滚动的区域在计算时有可能图片还没有加载完毕,所以会产生无法向下动的问题,如何解决这个问题那 ???这就需要多图片进行监听,原始的js图片加载的监听是 img.onload ,使用BScroll 只需要在图片上添加@load=“method” 属性即可。这样做了会面临一个传值的问题,怎么把BScroll的 值传递给调用的组件那???...原创 2019-07-11 16:35:05 · 755 阅读 · 0 评论 -
防抖函数 debounce
有时在监听事件时,在短时间内需要发送几百次的刷新,这样的话会严重的影响性能,比如vue 页面引入bscroll 在页面初始化加载图片时,需要时刻监听每个图片是否加载完毕,每次监听都需要调用BScroll的 refresh()函数,这样可以使用防抖函数增加性能,下面来个简单的防抖函数案例:debounce(func,delay){ timmer=null; if(...原创 2019-07-11 17:36:58 · 294 阅读 · 0 评论 -
vue toast 实现步骤
转载 2019-07-19 08:25:02 · 357 阅读 · 0 评论 -
vue 响应式原理 发布订阅模型 对象赋值
vue响应式原理主要靠两点://vue响应是原理//每个vue都包含一个对象实例,这个对象实例拥有defineProperty()监听属性的改变并进行赋值操作; Object.keys(obj).forEach(key=>{ let value=obj[key]; Object.defineProperty(obj,key,{ ...原创 2019-07-20 09:08:43 · 343 阅读 · 0 评论 -
spring 自定义全局异常
1、定义全局异常处理适配器,可以多个,我这目前只用一个:/** * 自定义异常类 */public class XdException extends RuntimeException { /** * 状态码 */ private Integer code; /** * 异常消息 */ private Stri...原创 2019-07-22 08:09:12 · 386 阅读 · 1 评论 -
jwt 创建token 和验证token 封装
import io.jsonwebtoken.Claims;import io.jsonwebtoken.Jwts;import io.jsonwebtoken.SignatureAlgorithm;import net.xdclass.xdvideo.domain.User;import java.util.Date;/** * jwt工具类 */public class ...原创 2019-07-22 08:11:58 · 331 阅读 · 0 评论 -
vue 所有的组件都继承自vue类的原型
通过 Vue.prototype.属性 进行修改原创 2019-07-01 11:49:04 · 1738 阅读 · 0 评论 -
vue 详情页标记 评论 详情 等注意事项
在商品详情页想换的操作中,我们需要根据客户的scroll 来显示选中状态,比如 描述 评论 参数等这样就需要对每个标记进行记录,一遍直接scrollTod(x,y)到制定的状态,或对该状态进行相关的操作;但是由于vue 在加载时有异步处理,如果直接使用直接像上面这种操作的话容易获取不到值,或者值获取的不正确,为了在视图挂载确认完成 时调用相关的操作,获取正确的数据,需要这样做:...原创 2019-07-15 08:43:37 · 522 阅读 · 0 评论 -
vue 箭头函数 及对象
无参 ()=》{};一个参数)(augs)=>{}一个参数一行可以省略大括号箭头函数this 作用域 是指最近的对象原创 2019-06-29 19:44:44 · 376 阅读 · 0 评论 -
vue 组件
组件数据组件定义 data函数原创 2019-06-26 16:52:17 · 109 阅读 · 0 评论 -
axios 默认属性
转载 2019-07-07 18:38:46 · 981 阅读 · 0 评论 -
axios get post 传参
get是 params{}post是data{}混用不可以的原创 2019-07-07 18:40:13 · 310 阅读 · 0 评论 -
封装axios
封装的思想非常重要一般为了防止第三方插件有问题或不维护,都会对第三方插件进行封装,一边出现问题方便同意修改,下面是axios的封装:在调用处只需要调用即可...转载 2019-07-07 19:20:08 · 334 阅读 · 0 评论 -
axios 高级封装(一)
调用:转载 2019-07-07 19:30:42 · 531 阅读 · 0 评论 -
axios 高级封装 promise版
使用:转载 2019-07-07 19:32:47 · 423 阅读 · 0 评论 -
axios 封装终极版
理解axios本身就是一个promise使用转载 2019-07-07 19:37:46 · 475 阅读 · 0 评论 -
axios 拦截器使用
主要分为请求成功、请求失败、响应成功、响应失败拦截转载 2019-07-07 21:19:47 · 314 阅读 · 0 评论 -
vue 父子通信,通过input改变父子值
本案例在调试过程中出现类型转换错误,v-model 绑定props 对象报错问题,均已经解决。<body> <div id="app"> <cpn :number="num" @numinput="numinput"></cpn> </div> <template id="inner"&g...原创 2019-06-27 09:33:32 · 359 阅读 · 0 评论 -
vue 插槽及插槽作用域 slot slot-scope
slot-scope 的意思通俗来讲就是使用父的标签,但是使用子的数据,具体看代码:<body> <div id="app"> <cpn> <template slot-scope="slots"> //slots 为子插槽的名字,即name属性 <sp...原创 2019-06-27 13:55:35 · 439 阅读 · 0 评论 -
vue 获取组件上方高度 及获取dom对象
vue都包含一个el对象,可以通过el对象获取dom对象;1、给组件设置ref ="wahaha"2、通过ref获取组件this.$refs.wahaha3、vue组件通过el获取domthis.$refs.wahaha.$el4、获取高度this.$refs.wahaha.$el.offsetTop...原创 2019-07-12 17:09:38 · 2218 阅读 · 0 评论 -
vue 组件样式添加注意事项
<template> <div class="tab-bar-item"> <slot v-if="isActive" name="tabbar-icon"></slot> <slot v-else name="tabbar-icon-active"></slot> <slot name="...原创 2019-07-04 09:25:19 · 837 阅读 · 0 评论 -
vue $route 和 $router 的区别和作用
$router指的是vue实例,而$route 主要指当前活跃状态的组件this.$route.path 指当前处于活跃的url路径;原创 2019-07-04 11:03:22 · 550 阅读 · 0 评论 -
vue 基本语法
子组件数据格式data(){ return { isActive:true }}原创 2019-07-04 11:12:33 · 92 阅读 · 0 评论 -
flex 布局基本语法
display:flex自动换行flex-wrap:wrap不换行,在一列显示flex-wrap:nowrap平局分配justify-content:space-around图片圆形显示border-radiusZ-index在使用绝对定位position:absolute属性条件下使用才能使用。通常我们让不同的对象盒子以不同顺序重叠排列,我们就是...原创 2019-07-10 08:58:51 · 109 阅读 · 0 评论 -
es6 字符串新语法
字符串可以使用单引号双引号,es6增加了·``(tab上面的那个) 支持换行原创 2019-06-26 08:22:50 · 269 阅读 · 0 评论