1. (vue2.x以上,1.x没有问题)vue和jq一起使用的冲突:在使用了v-bind: class的元素上,当vue和jq都需要增改class时,用jq加的属性可能无效。

原因:当数据的布尔值改变后(比如某个class需要加上),由于vue是在本次事件轮结束后更新DOM或改变属性,而jq的addClass是同步的,所以jq加上的类名会被vue覆盖。

解决方案:将jq的addClass写在Vue的nextTick里

2. 局部的components和路由的component分开放,路由的放在视图view文件夹里

3. v-show 只是在绑定值为false时加上display:none 在true时移出,而不会加上display:block 所以如果单独在css里写了display:none 即使这个元素v-show为true也是显示不出来的

4.vue做侧栏导航,用锚点实现,点击时切换active样式,当active = index直接写在模板的@click中时,导致锚点出bug,换成this.active = index 或者换成在method里写就没问题。(???不明原因)

5. 当路由切换时,vue组件及对应的数据会被就地销毁,*注意:如果vm的data里引用的是一个对象,而这个对象定义在vue的option对象外,将会形成闭包,将这个数据对象缓存起来,即使切换到别的页面,当再切换回来时,vue再次加载组件,还可以引用之前的数据对象(保留之前的所有状态)

eg.

//闭包中的data,即使vue实例被销毁它也不会消失

var data = {.....}

//vue option对象

export default {

  data() {

  return {

    data: data

    }

  }

}

一般来说,这样是弊大于利,虽然利于保存一些状态,但增加了污染的可能性。尤其是当页面中复用了好几个组件时,data将是共享状态的,容易出问题。

vue的坑的更多相关文章

  1. Vue 爬坑之路(六)—— 使用 Vuex + axios 发送请求

    Vue 原本有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2.0 之后,官方就不再更新 vue-resource 目前主流的 Vue 项目,都选择 axios ...

  2. Vue 爬坑之路(九)—— 用正确的姿势封装组件

    迄今为止做的最大的 Vue 项目终于提交测试,天天加班的日子终于告一段落... 在开发过程中,结合 Vue 组件化的特性,开发通用组件是很基础且重要的工作 通用组件必须具备高性能.低耦合的特性 为了满 ...

  3. vue踩坑记

    vue踩坑记 易错点 语法好难啊qwq 不要把'data'写成'date' 在v-html/v-bind中使用vue变量时不需要加变量名 在非vue事件中使用vue中变量时需要加变量名 正确 < ...

  4. Vue 爬坑之路(一)—— 使用 vue-cli 搭建项目

    vue-cli 是一个官方发布 vue.js 项目脚手架,使用 vue-cli 可以快速创建 vue 项目,GitHub地址是:https://github.com/vuejs/vue-cli vue ...

  5. Vue 爬坑之路(十二)—— vue-cli 3.x 搭建项目

    Vue Cli 3 官方文档:https://cli.vuejs.org/zh/guide/ 一.安装 @vue/cli 更新到 3.x 之后,vue-cli 的包名从 vue-cli 改成了 @vu ...

  6. Vue入坑教程(二)——项目结构详情介绍

    之前已经介绍了关于Vue的脚手架vue-cli的安装,以及一些文件目录介绍.具体可以查看<vue 入坑教程(一)--搭建vue-cli脚手架> 下面简单说一下具体的文件介绍 (一) pac ...

  7. vue踩坑之旅 -- computed watch

    vue踩坑之旅 -- computed watch 经常在使用vue初始化组件时,会报一些莫名其妙的错误,或者,数据明明有数据,确还是拿不到,这是多么痛苦而又令人忍不住抓耳挠腮,捶胸顿足啊 技术点 v ...

  8. Vue入坑第一篇

    写在前面的话:文章是个人学习过程中的总结,为方便以后回头在学习.文章中会参考官方文档和其他的一些文章,示例均为亲自编写和实践,若有写的不对的地方欢迎大家和我一起交流. 一.前言 本篇作为vue入门的一 ...

  9. Vue入坑日记: day - 01

    前言 最近做了一些小项目,小组里写前端的确实有点拉胯,于是自己动手写前端,因为大一学过web前端基础,所以对HTML,CSS还有印象,就直接对JS下手了,学了两天把JS大致搞明白了,顺便对JQuery ...

  10. 『vue踩坑日常』 在index.html中引入静态文件不生效

    Vue日常踩坑日常 -- 在index.html中引入静态文件不生效问题 本文针对的是Vue小白,不喜勿喷,谢谢 出现该问题的标志如下 控制台warning(Resource interpreted ...

随机推荐

  1. java.lang.NoClassDefFoundError: org/apache/jute/CsvOutputArchive

    1. 问题 看到上面的错误 你怎么想? 包冲突?我这里不是.项目用到了zookeeper,这个类是zookeeper的核心包里的类. 控制台一直打印这个错误 但是项目不影响使用,奇怪! 2. 解决办法 ...

  2. Makefile introduction (very old presentation)

  3. 转载:扒一扒Profiler中这几个“占坑鬼”

    https://blog.uwa4d.com/archives/presentandsync.html WaitForTargetFPS.Gfx.WaitForPresent 和 Graphics.P ...

  4. react:路由登陆后才能访问的控制

    react-router 通过创建一个 需要认证的路由 来限制登陆后才能访问. 官方例子:https://reacttraining.com/react-router/web/example/auth ...

  5. django配置setting文件

    添加app到INSTALLED_APPS列表中 INSTALLED_APPS = [ 'django.contrib.admin', 'django.contrib.auth', 'django.co ...

  6. 蒲公英 Bug 管理云

    官网访问地址:https://www.tracup.com/ 优势地方: ①免费使用 现在免费,今后也一直免费. ②无需部署 网站采用云端部署,这也就意味着无需开发者自己搭建.部署,注册一个蒲公英账号 ...

  7. OpenWrt实现802.11s组网模式

    参考 http://www.docin.com/p-277067204.html 无线网卡wlan0正常后,输入一下命令 iw dev wlan0 interface add mesh_iface t ...

  8. PHP用ActiveMq 实现消息列队

    1.各种安装 2.简单配置: jetty.xml localhost:8161 配置: activemq添加stomp的61613接口 conf/activemq.xml <transportC ...

  9. JDBC相关概念介绍

    一.JDBC相关概念介绍 1.1.数据库驱动 这里的驱动的概念和平时听到的那种驱动的概念是一样的,比如平时购买的声卡,网卡直接插到计算机上面是不能用的,必须要安装相应的驱动程序之后才能够使用声卡和网卡 ...

  10. codeblocks “can't find compiler executable in yourconfigured search ……”

    新安装的codeblocks 16.01,安装后打开提示如下,没法用..原因是编译器并没有找对自己安装的 mingw 的安装位置. 解决办法:如下图点击 Auto-detect 之后,会看到位置信息变 ...