Question

我正在尝试从下表中提取一个更新的值，以将其发送到数据库，但是看来Vue不支持双向数据绑定。谁能给我一个有关如何提取当前单元格值并将其传递给将新数据保存到数据库的函数的提示吗？

<table v-if="tableData.length > 0" class="table table-bordered table-sm">
<thead>
  <tr>
    <th scope="col">#</th>
    <th scope="col">Date From</th>
    <th scope="col">Date To</th>
    <th scope="col">Days</th>
    <th scope="col">Type</th>
    <th scope="col">Request Date</th>
  </tr>
</thead>
<tbody>
  <tr v-for="(object, index) in tableData" :key="index">
    <th scope="=row"><label class="tableNumberColumn">{{index + 1}}</label></th>
    <td @change="readData" v-for="(value, key) in object" :key="key" v-if="key != 'formId'">
      <div @change="readData" class="container tableColumnDiv" v-if="key === 'numberOfDays'" contenteditable="true">{{value}}</div>
      <div class="container tableColumnDiv" v-else-if="key === 'timeOffType'" contenteditable="true">{{value}}</div>
      <div v-else>
        <datepicker :value="value" :bootstrap-styling="true"></datepicker>
      </div>
    </td>
    <td>
      <b-button @click="deleteRow(index)" class="btn btn-sm buttonDelete">Delete</b-button>
    </td>
    <td>
      <b-button @click="update(index)" class="btn btn-sm buttonUpdate">Update</b-button>
    </td>
    <td>
      <b-button class="btn btn-sm buttonPrint">Print</b-button>
    </td>
  </tr>
</tbody>

Answer 1

由于要删除一些不必要的内容，我又粘贴了一次代码：

[Desktop Entry]
Version=5.0.4
Name=JetBrains PhpStorm
# Only KDE 4 seems to use GenericName, so we reuse the KDE strings.
# From Ubuntu's language-pack-kde-XX-base packages, version 9.04-20090413.
GenericName=Text Editor

Exec=phpstorm
Terminal=false
Icon=/opt/PhpStorm-145.1616.3/bin/webide.png
Type=Application
Categories=TextEditor;IDE;Development
X-Ayatana-Desktop-Shortcuts=NewWindow

[NewWindow Shortcut Group]
Name=New Window
Exec=phpstorm
TargetEnvironment=Unity

VueJS-从表中读取数据

1 个答案: