VUE(uni-app框架)开发微信小程序④-computed

计算属性：

computed是根据依赖关系进行缓存的计算，只有在它的相关依赖发生改变时才会进行更新，它可以进行数据计算，字符拼接，数据过滤等一系列操作。

代码如下：

<template>
	<view class="content">
		<view>价格:{{cnMoney}}</view>
		<view>总和：{{count}}</view>
		<view v-for="(item) in stu"
			:key="item.id">
			   学号：{{item.id}}---姓名：{{item.name}}---成绩：{{item.score}}
		</view>

	</view>
</template>
<script>

	export default {
		//1.data 定义数据
		data() {
			return {
				//价格
				money:1000,
				acount:30,
				bcount:40,
				ccount:50,
				dcount:60,
				firstName:"张",
				lastName:"林",
				//数组
				students:[
					{
					 id:1,
					 name:"张三",
					 score:69
					},
					 {
					 id:2,
					 name:"李四",
					 score:78 
					},
					 {
					 id:3,
					 name:"王五",
					 score:75
					 }
				]
			}
		},
		//计算属性
		computed:{
			//加工拼接,将价格符号和价格拼接在一起
			cnMoney(){
				return "￥"+this.money;
			},
			//acount到dcount进行简单的四则运算
			count(){
				return (parseInt(this.acount)*parseInt(this.bcount)+parseInt(this.ccount)-parseInt(this.dcount));
			},
			//过滤数组
			stu(){
				//过滤出成绩大于70的学生
				return this.students.filter(item=>item.score>70)
			}

		}
	}
</script>

实现效果如下：