vue：动态绑定style或class

// 绑定一个
<div
   class="template-content-parent"
   :class="{ curryChecked: t.id === radioChecked }"
>     
</div>

// 绑定多个
<div
   class="step-item"
   :class="{
     finish: s.index < active,
     curryStep: s.index === active,
     allfinish: isAllFinish,
   }"
>
</div>

// 数组、条件表达式、对象
<div
    :class="[
      calcRadioSize && !isCustomStyle ? 'm-radio--' + calcRadioSize : '',
      isCustomStyle ? 'm-radio--custom' : '',
      { 'm-radio--is-checked': calcIsChecked },
      { 'm-radio--is-disabled': calcIsDisabled }
    ]"
    :style="calcIsCustomStyle"
  >
</div>

// style：对象、模板字符串
<div
  v-if="isShowImgs"
  class="admin-info-header__img"
  :style="{ padding: `0 ${calcImgBoxPaddingX}` }"
>
</div>

<div class="system-icon-basics" :style="bagColor(item)">
  <m-iconfont
   :icon="
   (item.appLogo && item.appLogo.trim()) || 'el-icon-setting'
   "
   :size="'38'"
  />
</div>

<div
   :style="{ width: calcWidth(item) }"
>
</div>

<div
  :style="{ color: isTemplate === true ? '' : '#A7B1C7' }"
>
</div>

// 动态设置icon的背景色
    bagColor(item) {
      let bgColoe = {};
      if (item.appName === 'app1') {
        bgColoe = {
          background: '#83E254',
          'box-shadow': '0 5px 12px 0 rgba(82,196,25,0.53)',
        };
      } else if (item.appName === 'app2') {
        bgColoe = {
          background: '#FF6850',
          'box-shadow': '0 5px 12px 0 rgba(255,0,0,0.33)',
        };
      } else if (item.appName === 'app3') {
        bgColoe = {
          background: '#FEB416',
          'box-shadow': '0 5px 12px 0 rgba(254,174,4,0.53)',
        };
      } else {
        bgColoe = {
          background: '#6DA6FF',
          'box-shadow': '0 5px 12px 0 rgba(109,166,255,0.53)',
        };
      }
      return bgColoe;
    },

// 动态设置子系统特殊icon的大小
    specialIcon(item) {
      let styleObj = {};
      if (item.appLogo === 'icon1') {
        styleObj = {
          'line-height': '60px',
          'font-size': '136px',
        };
      }
      if (item.appLogo === 'icon2') {
        styleObj = {
          'line-height': '60px',
          'font-size': '60px',
        };
      }
      return styleObj;
    },

// 通过调用方法（绑定函数）、准确设置size
calcSize(item) {
   let size = '38';
   if (item.appLogo === 'icon1') {
      size = '136';
   } else if (item.appLogo === 'icon2') {
      size = '60';
   }
   if (item.appLogo === 'icon3') {
      size = '60';
   }
   return size;
},

// :style="calcSaveTemplateStyle" 小程序--这里如果加了()，就会报错
<button
   v-if="!isView"
   class="buttons saveTemplate"
   :style="calcSaveTemplateStyle"
   @tap="medicQuality"
>