在元素上添加 v-el：food-wrapper （不用驼峰的写法）

vue1版本

报错：

vue2版本

（vue2把vue1中的 v-el 改为了 ref 
vue1 v-el:foods-wrapper 调用的时候 this.el.foodsWrappervue2ref:foods−wrapper调用的时候this.

refs.foodsWrapper 这样写会报错 
原因： 
1、ref 的 key 和你填的key是一样的， 不会自动转换成驼峰式，如果你要用驼峰式 直接用ref=”foodsWrapper” 就可以了（解析不了 “-” 就尽量避免使用 “ -” ）

调用的时候 

 vue1:   this.$el.

 vue2:   this.$refs.menuWrapper

vue2.0中怎么获取元素的更多相关文章

  1. Vue2.0 中，“渐进式框架”和“自底向上增量开发的设计”这两个概念是什么？（转）

    https://www.zhihu.com/question/51907207?rf=55052497 徐飞 在我看来,渐进式代表的含义是:主张最少. 每个框架都不可避免会有自己的一些特点,从而会对使 ...

  2. Vue2.0中的transition组件

    组件的过度 Vue1.0中transition做为标签的行内属性被vue支持.但在Vue2.0中.Vue放弃了旧属性的支持并提供了transition组件,transition做为标签被使用. 使用t ...

  3. Vue2.0中的路由配置

    Vue2.0较Vue1.0,路由有了较大改变.看一下Vue2.0中的路由如何配置: 步骤一: 在main.js文件中引入相关模块以及组件及实例化vue对象配置选项路由及渲染App组件 默认设置如下: ...

  4. vue2.0中，由于页面完成之后dom还未加载完成如何进行操作

    再vue中,当页面加载完成以后,dom还没有加载,是无法获取进行操作的,但是在vue2.0中提供了一个方法:this.$nextTick,在这个回调函数里面写dom操作即可: 如下代码: create ...

  5. vue2.0中动画

    #vue2.0中css动画不显示的坑: transition中包含的两个标签如果相同(此处都是p标签),需要为元素指定key.如果标签名不同的话,不指定key也可以出现动画效果. #vue2.0中js ...

  6. vue2.0中router-link详解

    vue2.0中router-link详解:https://blog.csdn.net/lhjuejiang/article/details/81082090 在vue2.0中,原来的v-link指令已 ...

  7. router-view在vue2.0中不显示，解决方法

    学习的router-view路由一直不显示,我翻看vue文档,花费1个小事终于找到原因,希望我的问题能给初学的同学,带来福音,版本不一样,真的烦 在此总结记录,以免以后在此遇到此问题 //配置路由 c ...

  8. vue2.0中使用pug(jade)

    第一部分:pug(jade)模板引擎 pug,原名jade,是流行的HTML模板引擎,它是HAML在JavaScript上的实现,最大的特色是使用缩进排列替代成对标签. 它简化了HTML的成对标签的写 ...

  9. vue2.0中使用less

    第一部分:Less语言 与上一篇<vue2.0中使用sass>介绍的Sass语言一样,Less语言也是一种CSS的扩展语言,增加了变量.混合(minin).函数等功能,让CSS更易维护.方 ...

随机推荐

  1. HTML textarea 无法修改 value 的问题

    当设置了  textarea  的 value 后,发现页面的输入框无法输入值, <textarea id="></textarea> 解决方法: 只需将值设置在  ...

  2. python 类中__init__,__new__,__class__的使用详解

    1.python中所有类默认继承object类,而object类提供了很多原始的内置属性和方法,所有用户定义的类在python 中也会继承这些内置属性.我们可以通过dir()进行查看.虽然python ...

  3. 配置kubectl客户端通过token方式访问kube-apiserver

    使用的变量 本文档用到的变量定义如下: $ export MASTER_IP=XX.XX.XX.XX # 替换为 kubernetes master VIP $ export KUBE_APISERV ...

  4. ruby 发送邮件

    产品构建.打包.部署完需要发送邮件通知相关人员进行验证.请看过程 #encoding:utf-8 require 'mail' #~ branch = ARGV.to_s.sub('[','').su ...

  5. [HAOI2011][bzoj2301] Problem b [莫比乌斯反演+容斥原理+分块前缀和优化]

    题面: 传送门 有洛谷就尽量放洛谷链接呗,界面友好一点 思路: 和HDU1695比较像,但是这一回有50000组数据,直接莫比乌斯反演慢慢加的话会T 先解决一个前置问题:怎么处理a,c不是1的情况? ...

  6. JMeter 性能测试进阶实战

    课程简介 本课程制作的主要目的是为了让大家快速上手 JMeter,期间穿插了大量主流项目中用到的技术,以及结合当今主流微服务技术提供了测试 Dubbo 接口.Java 工程技术具体实施方案,注重实践. ...

  7. Robot Framework通过Python SMTP进行email收发测试。

    工作中需要对发送的邮件进行过滤,方法基本属于ACL控制,即查看“源/目的”邮件地址,邮件标题,邮件正文,邮件附件等进行过滤. 所以需要先模拟一下用Python能否达到邮件Client,Server的功 ...

  8. Gym 100971B 水&愚

    Description standard input/output Announcement   Statements A permutation of n numbers is a sequence ...

  9. vscode设置背景图片

    最近在知乎上看见有人设置了vscode编辑器的背景图片,觉得很新鲜,就尝试以一下,倒是成功了. 1.首先在vscode扩展中,找到background这个插件,快捷键Ctrl+shift+x 2.完成 ...

  10. BZOJ【1606】购买干草

    1606: [Usaco2008 Dec]Hay For Sale 购买干草 Time Limit: 5 Sec  Memory Limit: 64 MBSubmit: 859  Solved: 63 ...