uniapp计算属性

计算属性:可以理解为是对data中的数据提供了一种加工或过滤的能力

<template>
	<view>
		<view
		v-for="item in filterList"
		:key="item.id"
		>
		{
   
   {item.name}}
		</view>
		<!-- <view
		v-for="item in porcessList"
		:key="item.id"
		>
		{
   
   {item.name}} -->
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [
					{
						id: 0,
						name: 'vue'
					},
					{
						id: 1,
						name: 'react'
					},
					{
						id: 3,
						name: 'angular'
					}
				]
			}
		},
		// 计算属性
		computed: {
			// 过滤
			filterList() {
				return this.list.filter(v=>v.id<=1);
			},
			// 加工
			porcessList() {
				return this.list.map(v=>{
					v.name = 'uniapp'
					return v;
				})
			}
		}
	}
</script>

<style>
</style>

猜你喜欢

转载自blog.csdn.net/qq2942713658/article/details/114211070