vue计算属性
html代码：
<div class="itany">
<p>{{msg}}</p>
<a href="#">{{erm}}</a>
</div>
js:
<script src="vue.js"></script>
<script>
new Vue({
el:".itany",
data:{
msg:"hello vue"
},
computed:{
erm:function(){
return this.msg.split(' ').reverse().join('====')
}
}
})
</script>
vue 属性
html：
<div class="itany">
{{mas}}
<h1 ref="vue">hello</h1>
</div>
js：
<script src="vue.js"></script>
<script>
var v=new Vue({
el:'.itany',
data:{
mas:"你好"
},
uname:'jack',
age:18
})
// $el 获取vue绑定的元素的
console.log(v.$el);
v.$el.style.color="red";
// $data 获取vue实例中的数据
console.log(v.$data);
// $options 获取vue实例中的自定义属性
console.log(v.$options);
console.log(v.$options.uname);
console.log(v.$options.age);
// $refs 获取所有带ref属性的元素
console.log(v.$refs.vue);
</script>
filter过滤 保留俩位小数
html：
<div id='itany'>
<p>{{123.456|number}}</p>
</div>
js：
<script src='js/vue.js'></script>
<script>
new Vue({
el:'#itany',
filters:{
number:function(data){
return data.toFixed(2)
}
}
})
用过滤器获取时间
html：
<div class="itany">
<p>{{new Date()|zero}}</p>
</div>
js：
<script src="vue.js"></script>
<script>
new Vue({
el:'.itany',
filters:{
zero:function(data){
return data.getFullYear()+'年'+(data.getMonth()+1)+'月'+data.getDate()+'日'+'星期'+data.getDay()+','+data.getHours()+'点'+data.getMinutes()+'分'+data.getSeconds()+'秒'
}
}
})
</script>
