Vue ouvre une fenêtre dans le tableau pour afficher les informations d'invite, en utilisant le composant el-popover

L'effet est le suivant : lorsque vous survolez l'entrée, elle s'affiche comme suit

 ​​​​​​​

 

        <template>
          <el-popover
            placement="top"
            width="200"
            trigger="hover"
            popper-class="monitor-yt-popover"
          >
            <span>规则:{
   
   { config.unitId }}</span>
            <el-input
              v-model="config.unitId"
              slot="reference"
              type="text"
              @blur="
                getUnitScoreVal()
              "
            ></el-input>
          </el-popover>
        </template>

Le style est le suivant : notez qu'il ne peut pas être écrit dans la balise de style de portée, l'exactitude est la suivante

<style>
.el-popover.monitor-yt-popover {
  background-color: #fbfbfb;
  border-color: #f56c6c;
  color: #f56c6c;
}

.monitor-yt-popover .popper__arrow::after {
  border-top-color: #f56c6c !important;
}
</style>

Je suppose que tu aimes

Origine blog.csdn.net/weixin_45294459/article/details/127065679
conseillé
Classement