Vue 计算属性(Computed)传参

Vue 计算属性(Computed)传参

使用computed时,如果需要传递参数, 需要使用return返回一个带参数的函数。

简单示例

<template>
  <div>
    <div 
      v-for="student in students" 
      :key="student.id"
    >
      <span>姓名: {{ student.name }} span>
      <span>年龄: {{ student.age }} span>
      <span>是否成年: {{ adult(student.age) }} span>
    div>
  div>
template>
<script>
  export default {
    name: 'ComputedParams',
    data() {
      return {
        students: [
          { id: 1, name: '张三', age: 17 },
          { id: 2, name: '李四', age: 18 },
          { id: 3, name: '王五', age: 19 }
        ]
      };
    },
    computed: {
      adult() {
        return (age) => age < 18 ? '未成年' : '已成年'
      }
    }
  }
</script>

你可能感兴趣的:(vue,前端,vue.js,javascript,前端)