如何使用Quasar使数据表中的单元格可编辑在特定行上？

Question

我在Quasar中使用data table组件。我能够查看表格，它很棒。这里

现在我需要点击一个行单元格并使其成为可编辑的输入文本字段，按下“Enter”按钮后我需要将数据保存在那里。 怎么进一步？请帮帮我。

Answer 1

首先，我没有找到数据表的任何内置功能来编辑行。所以我想到了我的自定义功能。 Quasar中关于Data table的好处是它提供了使用模板来处理任何行。

所以我使用了这样的模板：

<template slot="col-Name" scope="cell">
            <span @click = "nameAction()">{{cell.data}}</span>
            <input type="text"
               v-model="cell.data" v-show="edit1" v-on:keyup.enter="edit1 = false;"> <br>
         </template>

所以在这里我要考虑列（Name）中的一行，并点击调用名为 nameAction 的函数的行。 这是方法中的函数：

nameAction: function (row) {
  this.edit1 = true
}

这里我在单击行时可以看到输入字段。 作为参考，您可以使用此fiddle。