Question

我有一个名为Main.vue的文件，并且在其中导入了其他2个vue文件（Table.vue和Form.vue）。一张表格和一种形式显示在两个不同的标签中。我想要实现的是：

如果我在表格的一行中按下编辑按钮，我想用行数据填写表格。

我要做的是：

1）按编辑按钮以从行中检索数据

2）在Table.vue中调用一个函数-editData（）

3）在editData（）内部，我在Form.vue中调用另一个函数-editRecord（modelEdit），在其中传递行数据

按下编辑按钮，我在Table.vue中调用一个函数，此方法在Form.vue中调用另一个方法以传递数据。

这是Table.vue中的方法：

editData(){
      form.methods.editRecord(
        JSON.stringify(this.selected, undefined, 4)
      );

这是Form.vue中的方法

editRecord(modelEdit) {
  let self = this;
  self.model = modelEdit;
  console.log("model", self.model);
}

模型已正确填写，但表格为空。

为了测试，我在Form.vue中添加了一个调用此函数的按钮（在Form.vue内部）：

testModel() {
  this.model = {
    "formField1": "Test1",
    "formField2": "Test2"
  }
  }

在这种情况下，它会在表单中填充testModel（）中的数据。但是，如果我从Table.vue调用此方法，它将不起作用。

表单是根据json模式自动生成的（我使用vue-form-generator）

...
    <vue-form-generator :schema="schema" :model="model" :options="formOptions">
 ...   
    export default {
      data() {
        return {
          model: {},
          schema: jsonschema,
    ...

我希望这很清楚...有任何提示吗？

vue，js从另一个vue文件填写表格

0 个答案: