Vue のフィルターの適用シナリオの詳細な説明

// 残りは、私がマークしたものを見てください。 //scope.row は現在の行を取得します <template slot-scope="scope">
            <テンプレート v-if="item.formType == 'ラベル'">
              <el-ボタン
                v-if="item.link!=未定義"
                タイプ="text" サイズ="small" @click="handleColumnClick(item.link,scope.row)">
                //filter は通常フィルタリングには使用されません|
                //showLabelValue は書き出されません //メソッドの 1 つのパラメータに対応するフィルタには 2 つのパラメータがあります //最初のパラメータは前の列によって返される値です //N-1 番目のパラメータは渡す値です {{ scope.row | showLabelValue(item) | canViewAmount(canViewAmount,xtType,item) }}
              </el-button>
              <テンプレート v-else>
                {{ scope.row | showLabelValue(item) | canViewAmount(canViewAmount,xtType,item) }}
              </テンプレート>
            </テンプレート>
</テンプレート>
エクスポートデフォルト{
 フィルター:
 //row は、scope.rowshowLabelValue(row,item) によって返されるデータです。
 '値'を返す
 }
 //値、canView 権限、xtType のページ、アイテム リスト データ //showLabelValue が値を返す場合、対応する canViewAmount パラメータ値は 'value' です
    canViewAmount(値、canView、xtType、項目) {
    //条件が満たされると、「***」が表示されます（表示のみ）。データベースに保存される内容は元のリストのままです。if (!canView && xtType == 'salesOrder') {
        if (item.field == 'priceNoTax' || item.field == 'amountNoTax' || item.field == 'price' || item.field == 'amount') {
          戻る '***'
        }
      }
      if (!canView && xtType == 'プロジェクト') {
        if (item.field == 'amount' || item.field == 'amountNoTax') {
          戻る '***'
        }
      }
      戻り値
    }
  },