vue3 + computed 传参使用

默认是 get
get 当 props.title 改变时触发
set 当 visible 被改变时触发 参数 visible 是当前值

const title = computed(() => props.title);

  const visible = computed({
    get() {
      return props.dialogVisible;
    },
    set(visible: boolean) {
      emit('update:dialogVisible', visible);
    },
  });

利用 computed 可以解决 嵌套 v-model 例：

// 在子组件中
<el-dialog v-model="dialogVisible"></el-dialog>
const dialogVisible = computed({
  get() {
    return props.dialogVisible;
  },
  set(visible: boolean) {
    emit('update:dialogVisible', visible);
  },
});

// 父组件
<Dialog v-model:dialogVisible="dialogVisible"  />

计算属性传参使用

<div class="tag" :class="color(item.status)"></div>

const color = computed(() => (status) => {
  if (status === 1) return "pedding";
  else if (status === 2) return "end";
});