在这里总结一下学习Vue遇到的易错点,持续更新

1.实例化一个Vue对象:

通过new Vue({

el:'#id',

data:{

a:'字符串1',

b:‘字符串2’

})

这里的Vue必须大写V!小写v是行不通的,刚开始没注意,多次实例化失败!

2.v-text属性

<div id="app2" v-text="message">

<input v-model="message" />
             <hello></hello>

</div>

父元素定义了v-text属性,那么内部添加的各种标签内容都不会显示了,只显示{{message}}

等同于:

<div id="app2">

{{message}}

</div>

3.由于ID的唯一性,相同ID定义的组件只能用一次

<div id="app" >
     {{message}}
  </div>
  <div id="app" v-text="message">
  </div>

上面用ID=“app”定义的组件,第二个是不会显示的。

4.v-for指令的列表渲染

  <div v-for="(value, key) in object">
     {{ key }}: {{ value }}
  </div>
  <div v-for="(key, value) in object">
     {{ key }}: {{ value }}
  </div>
仔细看这两个组件的v-for指令部分,虽然div内部的内容都是希望以“key:value”的方式展现出来,
但是只有上面v-for指令的写法才会“正确”的显示我们所想看到的键值对,
下面的写法最终会以“value:key”的方式显示。
 
5.数据绑定---数据源与变量的唯一性
最近在为轮播图插件绑定数据的时候遇到的:
在这里每个数据源赋值给了唯一变量,但是l1、l5两个变量在html里用了两次,造成页面最终无法渲染;
在这里每个变量都是唯一的,但是5.jpg、1.jpg这两个数据源都被赋值两次,造成页面最终无法渲染;
这是我最终的写法。
ps:将7张图片分成两个div然后分别绑定数据我也试过,html依旧无法渲染。
最后总结:在同一组件内变量是唯一的,而数据源在整个html文件内都是唯一的。
 
6.
 

Vue--学习过程中遇到的坑的更多相关文章

  1. 使用python requests库写接口自动化测试--记录学习过程中遇到的坑(1)

    一直听说python requests库对于接口自动化测试特别合适,但由于自身代码基础薄弱,一直没有实践: 这次赶上公司项目需要,同事小伙伴们一起学习写接口自动化脚本,听起来特别给力,赶紧实践一把: ...

  2. golang 学习过程中踩的坑

    目录 [他人总结] 首字母大写才是对外可见的 包的初始化函数顺序问题 DB 连接泄漏问题 err 常用写法 goroutine 内的变量 指针可能是 nil 多层 map 未初始化 [他人总结] ht ...

  3. java学习过程中遇到的坑及解决方法

    1. Table 'my_data_base.gjp_zhangwu' doesn't exist Query: select * from gjp_zhangwu Parameters: 数据库中的 ...

  4. python学习过程中的踩坑记录<若干,随时更新>

    问题1:python中print的连串输出与java不一样? 输入print(code +"+++"); --在代码中写入,界面未报错,但是告诉你不行 会报错,如图: 解决办法: ...

  5. vue中的css作用域、vue中的scoped坑点

    一.css作用域 之前一直很困扰css的作用域问题,即使是模块化编程下,在对应的模块的js中import css进来,这个css仍然是全局的.导致在css中需要加上对应模块的html的id/class ...

  6. maven build和push image中遇到的坑(学习过程记录)

    最近在做jenkins的持续集成构建,其中一项是要实现docker容器化部署.项目本身是maven项目,我对于maven和docker都没有什么认知基础,于是求助百度和官网,从头开始啃起.遇到了不少的 ...

  7. Jmeter学习过程中遇到的那些坑

    开个新帖,持续记录学习jmeter过程中遇到的坑... (1)出师不利 由于公司的产品都是客户端模式,所以所有的接口测试都从获取access-token开始.妹的...上来就是一个坑... 一开始的配 ...

  8. vue中遇到的坑

    如何解决在vue中替换图片.一个使用base64,而我们使用zepto之后,src找不到资源,因为已经打包了,难道强行写base64. 1. 引入文件时语法很重要! import "Foot ...

  9. vue入坑教程(二)在vue项目中如何导入element以及sass

    在项目中导入element以及sass.stylus等方便开发的工具以及UI框架 (1)如何在vue项目中导入elementUI框架 elementUI是饿了么团队开发出来基于vue的前端UI框架,其 ...

  10. Vue基础系列(三)——Vue模板中的数据绑定语法

    写在前面的话: 文章是个人学习过程中的总结,为方便以后回头在学习. 文章中会参考官方文档和其他的一些文章,示例均为亲自编写和实践,若有写的不对的地方欢迎大家和我一起交流. VUE基础系列目录 < ...

随机推荐

  1. 【一天一道LeetCode】#83. Remove Duplicates from Sorted List

    一天一道LeetCode 本系列文章已全部上传至我的github,地址:ZeeCoder's Github 欢迎大家关注我的新浪微博,我的新浪微博 欢迎转载,转载请注明出处 (一)题目 Given a ...

  2. 【Unity Shaders】Reflecting Your World —— Unity3D中简单的Cubemap反射

    本系列主要参考<Unity Shaders and Effects Cookbook>一书(感谢原书作者),同时会加上一点个人理解或拓展. 这里是本书所有的插图.这里是本书所需的代码和资源 ...

  3. ActivityManagerService启动过程分析

    之前讲Android的View的绘制原理和流程的时候,讲到过在Android调用setContentView之后,Android调用了一个prepreTravle的方法,这里面就提到了Activity ...

  4. 简约才是王道? CardView 的使用

    发现个好看的东东 CardView,他在support v7包中~~ 顾名思义就是卡片view,可以设置阴影,圆角,等等.. 样子是这样的: 或者你还可以放到listview里 是这样的: http: ...

  5. 网站开发进阶(二十九)HTML特殊转义字符

    HTML特殊转义字符 参考文献 http://tool.oschina.net/commons?type=2 美文美图

  6. 开源视频会议系统:OpenMeetings 安装方法

    OpenMeetings是一个多语言可定制的视频会议和协作系统.说到OpenMeetings就应该提一下red5因为OpenMeetings 的视频服务是加载red5上面的.Red5是一款基于JAVA ...

  7. (十七)TableView的本地性能优化

    面试中常常会问TableView的性能优化. TableView只会加载能看到的Cell,每当有一个Cell进入视野范围内,就会调用. 存在着内存隐患,如果用户拖动的很快,所以内存会飙升的很快,因此要 ...

  8. mysql进阶(八)怎么对varchar类型排序问题

    MySQL中怎么对varchar类型排序问题 asc 升级 desc降序 在mysql默认order by 只对数字与日期类型可以排序,但对于varchar字符型类型排序好像没有用了,下面我来给各位同 ...

  9. android资源库

    原文地址:http://blog.csdn.net/xiechengfa/article/details/38830751 在摸索过程中,GitHub上搜集了很多很棒的Android第三方库,推荐给在 ...

  10. 软考论文的六大应对策略V1.0

    软考论文的六大应对策略V1.0 短短2个小时,要写3000字的文章,对习惯了用电脑敲字.办公的IT从业人员而言,难度不小.尤其,大家会提笔忘字.笔者的应试策略,就是勤学苦练,考试前的一个星期,摸清套路 ...