【vue】computed的传参和element-plus弹窗的显示

1. vue3中computed的传参使用

<template>
    <el-tag :type="computedProcessTypeStyle(scope.row.processType)" size="large">
                {{ computedProcessTypeName(scope.row.processType) }}
   el-tag>
 template>
 
<script setup lang="ts">
const computedProcessTypeStyle = computed(() => (type: string) => {
  if (type === 'new' || type === 'fail') {
    return 'danger';
  }
  if (type === 'processed') {
    return 'success';
  }
  if (type === 'ticket') {
    return '';
  }
  if (type === 'close') {
    return 'info';
  }
  if (type === 'unknown') {
    return 'warning';
  }
});
script>

2.element-plus弹窗的显示(方法一)

【vue】computed的传参和element-plus弹窗的显示_第1张图片
使用该组件:
在这里插入图片描述

3. element-plus弹窗的显示(方法二)

这种写法和上面的写法实现的效果一样,都可用于值的双向绑定,defineModel写法更简单!
注意是在

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