Vue.js 表数据呈现

当我按下save（保存）按钮以使用vue存储在变量上时，我希望获得“th”和“td”的标题

我的HTML代码

                        <tr>
                            <th>Himalayan Salajit (Pakistan Only)*</th>
                            <td>PKR 800</td>
                            <td class="text-center">
                                <select class="form-control form-control-inline">
                                    <option>0</option>
                                    <option>1</option>
                                    <option>2</option>
                                    <option>3</option>
                                    <option>4</option>
                                    <option>5</option>
                                    <option>6</option>
                                    <option>7</option>
                                    <option>8</option>
                                    <option>9</option>
                                    <option>10</option>
                                </select>
                            </td>
                            <td class="text-right">PKR 0.00</td>
                        </tr>

喜马拉雅萨拉吉特（仅限巴基斯坦）*
PKR 800
0
1.
2.
3.
4.
5.
6.
7.
8.
9
10
PKR 0.00

使用数组代替所有数据和行，然后可以使用v-model捕获选择

样本数据：

数据：[
{
标签：“喜马拉雅萨拉吉特（仅巴基斯坦）*”，
金额：800，
选项：[0,1,2,3,4,5,6,7,8,9,10]，
selectedOption:null，
},
{
标签：“某物”，
金额：200，
选项：[0,1,2,3,4,5,6,7,8,9,10]，
selectedOption:null，
},
{
标签：“其他东西”，
金额：100，
选项：[0,1,2,3,4,5,6,7,8,9,10]，
selectedOption:null，
},
]

然后您可以使用此数据并在模板中循环它。因为您只需要标签和所选选项，所以可以过滤掉不需要的其他值（下面的codesandbox中的示例）

因此，您的模板现在看起来像：

{{dat.label}
{{dat.amount}}
{{opt}}
PKR 0.00

我们在数组中循环并显示所需的数据

---

供参考

这是否回答了您的问题？你想获得first th和td或所有头衔吗？@shahidiqbal AllThank buddy非常有帮助。谢谢。

                        <tr>
                            <th>Himalayan Salajit (Pakistan Only)*</th>
                            <td>PKR 800</td>
                            <td class="text-center">
                                <select class="form-control form-control-inline">
                                    <option>0</option>
                                    <option>1</option>
                                    <option>2</option>
                                    <option>3</option>
                                    <option>4</option>
                                    <option>5</option>
                                    <option>6</option>
                                    <option>7</option>
                                    <option>8</option>
                                    <option>9</option>
                                    <option>10</option>
                                </select>
                            </td>
                            <td class="text-right">PKR 0.00</td>
                        </tr>