Vueプロジェクトのdivスパンおよび無効化属性のない他のタグは無効化(クリック禁止)に設定され、グレー表示されます

divとspanは同じですが、ここではデモンストレーションに使用されるのはspanのみです

まず、notClickスタイルを動的に追加します。

 <span :class="{notClick:isNotClick}"  @click="handleDel(scope.row)">删除</span>
.notClick {
  // pointer-events: none;
  color:grey;
  cursor:not-allowed;
}

ここにナレッジポイントがあります。pointer-events:noneとcursor:not-allowedを同時に使用することはできません。つまり、クリックを禁止する赤い丸とスラッシュとマウスを同時にcssに設定することはできません。ヘルプを表示するには、jsを使用する必要があります。

クリックイベントでクリックを無効にするかどうかを判断することにより:

 handleDel(data) {
     if(data.status){
        return;
    }

ここでは、データのステータスが1の場合、同期が成功し、クリックによる削除が無効になっていると判断しています。

結果は次のとおりです。

この時点で、問題は解決されました。 

おすすめ

転載: blog.csdn.net/a1059526327/article/details/108520386