Vue计算属性如何传参数

609 阅读1分钟

Dom部分

<div :key="index" @click="clickProject(item)" class="display-style list-item" v-for="(item,index) in mapList">
              <p style="text-align: left;padding-left: 10px">{{ item.project_name }}</p>
              <p style="text-align: center;padding-left: 10px">{{ item.templateTypeName }}</p>
              <p style="text-align: right"><span :style="getColor(item.status)">{{ item.status | formatStatus }}</span></p>
            </div>

计算属性

computed: {
    getColor() {
      return (value) => {
        let bgColor = value===0?"#3699FF":value===1?"#00C09A":value===2?"#AAB9CC":"#FF8B35";
        return {'background-color': bgColor};
      }
    }
}

computed原本不能接收参数,但是如果需要传参可以采用闭包的方式,return出一个函数,里面的函数可以接收参数,就这,没了