我的Vue之旅(1)

2020-10-17

今天主要学习了Vue中以下几个指令的使用

  • v-bind
  • v-if
  • v-on
  • v-for
  • v-model

其中v-bind与v-model都是属于数据绑定,v-bind通常来说是绑定属性与data中的数据,而v-model较多在表单中使用,实现数据的双向绑定。
v-if的话和其他语言中的if使用差不多吧,当条件为true时,标签的内容就可以生效,即在页面上显示出来。

v-for循环加载对象列表中的对象,做一些相同的操作,不过要搞清楚v-for应该放在需要进行操作的标签内,不要搞错位置了。v-on就是一个
监听了,通常是接一个事件,比如点击,然后加上这个事件对应的处理操作了,可以直接写JS语句在后面,操作复杂可以通过函数代替。

比较有意思的是,在写v-for例子的时候,把v-for放在了ol标签中,出来的结果就是所有的对象前面的序号都是1,尴尬尴尬。


Vue 生命周期钩子

  • beforeCreate
  • created
  • beforeMount
  • mounted
  • beforeUpdate
  • updated
  • deforeDestory
  • destoryed

Examples: Demo1.html
Github:  https://github.com/jvxiao/vue-road

posted @ 2020-10-24 22:12  蓝柯柯  阅读(39)  评论(0编辑  收藏  举报