1，过滤器
过滤器：让要显示在页面上的内容进行重新筛选
全局过滤器
new Vue({
el:''
data:{}
methods:{},
filters:{
过滤器名：function（data）{
}
})
局部过滤器
js:
Vue.filter('过滤器的名字'，function(){
})
2，js中的获取当前日期
var date=new Date();
console.log(date);
//年
var year=date.getFullYear();
//月
var mon=date.getMonth()+1;
//日
var tian=date.getDate();
//星期
var day=date.getDay();
//小时
var hours=date.getHours();
//分钟
var min=date.getMinutes();
//秒
var sec=date.getSeconds();
console.log(sec)
document.querySelector('h1').innerHTML='现在时间是'+year+'年'+mon+'月'+tian+'日,星期'+day+','+hours+'点'+min+'分'+sec+'秒';
效果图
图片.png
3，保留小数点后两位
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div id="app">
<p>{{num|number}}</p> </div>
<script src='js/vue.js'></script>
<script>
new Vue({
el: '#app',
data: {
num:Math.random() * 7
},
filters:{
number:function(data){
return data.toFixed(2)
}
}
})
</script>
</body>
</html>
4，计算属性：对于任何复杂逻辑，你都应当使用计算属性
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div id='itany'>
<button @click='add'>加货</button>
<h1>{{total}}</h1>
</div>
<script src='js/vue.js'></script>
<script>
new Vue({
el:'#itany',
data:{
package1:{price:2,count:3},
package2:{price:4,count:6}
},
computed:{
total:function(){
return this.package1.price*this.package1.count+this.package2.price*this.package2.count
}
},
methods:{
add:function(){
this.package1.count++;
}
}
})
</script>
</body>
</html>
5，总结数组API
String(); 数组转字符串 将数组中的元素用逗号连接成字符串 String(arr)或arr.toString()
join(); 连接 用连接符把数组里面的元素连接成字符串 arr.join
concat(); 拼接 不会修改原数组 arr.concat("a","b",arr1)
slice(); 截取 不会修改原数组 arr.slice(start[,end])
splice(); 删除、插入、替换 直接修改原数组 arr.splice(start,n[,value1,value2...])
reverse(); 翻转数组 直接修改原数组 arr.reverse()
push(); 结尾入栈 在数组末尾追加元素 arr.push(value1[,value2,arr1])
pop(); 结尾出栈 弹出数组最末尾的元素 arr.pop()
unshift(); 开头入栈 在数组的最开头插入元素 arr.unshift(value)
shift(); 开头出栈 弹出数组最开头的元素。 arr.shift()
