Vue的技巧

Vue中的坑

  1. 如果Vue模块中没有使用data中的数据,那data中的数据发生改变时,vue的浏览器插件 Vue tool不会刷新
  2. 使用了定时器settimeout()的话,定时器是由浏览器直接调用的,所以它的this指向的是 **==Windows==**,而不是==vue==
  3. Vue的绑定样式,使用style绑定要注意的点
    1. 如果是两个单词,类似background-color这种,要去掉中间的“-”,写成一个组合词backgroundColor

技巧

  1. Vue上简单的操作可以直接写在Vue模块里,因为Vue模块可以直接访问Vue实例上的所有属性

eg:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

<div id="root">
<div> {{file}}</div>
<!- @xxx="yyyy" xxx是事件名,yyy可以写一些简单的语句-->
<button @click="file='炎热'"></button>
</div>
<script>
Vue.config.productionTip = false //阻止vue在启动时生成生产提示
new Vue({
el: '#root',
data: {
file:'helloworld'
},
methods: {
}
})
</script>