Question

我是新手。我使用vue ^ 2.6.10和element-ui ^ 2.12.0。这是我的api响应数据：

API结果

[
    {
        name: 'Test',
        age: 18,
        cash: null,
    },
    {
        name: 'Test2',
        age: 28,
        cash: 1004,
    }
]

这是我的桌子

<el-row class="el-row-margin">
    <el-table
    :data="personalData"
    border
    >

        <el-table-column
            v-slot="scope"
            fixed
            :label="$t('cash')"
        >
            <el-input v-model="scope.cash" /> <!-- How could I show cash as 0, when this value is nul -->
        </el-table-column>
    </el-table>
</el-row>

如何检查scope.cash是否为空将显示0。谢谢您的帮助。

Answer 1

用<el-input v-model="{{ scope.cash | formatValue }}" />替换元素

将其放置在data上方的脚本标签中

filters: {
  formatValue: formatValue (data) {
    return data?data:0
  }
},

此过滤器最多可用于键formatValue

Answer 2

您必须像这样使用value和@input：

<el-input :value="scope.cash | formatValue" @input="scope.cash= $event"></el-input>

当然，您必须如上所述编写自己的过滤器：

filters: {
  formatValue: formatValue (data) {
    return data 
      ? data
      : 0
  }
},

如何检查v模型对象的值

2 个答案: