用vue写一个九九乘法表

在Vue中创建一个九九乘法表，可以利用模板（template）、数据绑定（data）以及循环结构来实现。首先，你需要安装Vue并在HTML文件中引入Vue.js。然后，你可以创建一个Vue组件，例如`MultiplicationTable.vue`：

<template>
  <div class="multiplication-table">
    <table>
      <tbody v-for="(row, rowIndex) in rows" :key="rowIndex">
        <tr>
          <td v-for="(cell, cellIndex) in row" :key="cellIndex">{{ cell }}</td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      rows: Array.from({ length: 9 }, (_, i) => Array(i + 1).fill(i + 1))
    };
  }
};
</script>

<style scoped>
.multiplication-table {
  width: 100%;
  border-collapse: collapse;
}
</style>

在这个例子中：
- `v-for`指令用于遍历两个嵌套的数组，分别表示行(row)和列(cell)，生成表格的每个单元格并显示相应的乘积。
- `rows`是一个二维数组，初始化为一个9x9的乘法表。

当你将这个组件插入到Vue应用中时，它会自动生成九九乘法表。