Question

将Handsontable HotTable组件放置在Vuetify Stepper内时，仅在单击页面上的某个位置后，Handsontable才可见。但是，如果将HotTable组件放置在Stepper之外，则会立即显示它。它应该在步骤1中立即可见。

为演示此意外行为，我在CodePen上创建了Vuetify Stepper示例，并添加了“ handsontable”和“ @ handsontable / vue”。

Vuetify Stepper with Handsontable on CodePen

<div id="app">
  <v-app id="inspire">
    <v-stepper v-model="e1">
      <v-stepper-header>
        <v-stepper-step :complete="e1 > 1" step="1">Name of step 1</v-stepper-step>
        <v-divider></v-divider>
        <v-stepper-step :complete="e1 > 2" step="2">Name of step 2</v-stepper-step>
        <v-divider></v-divider>
        <v-stepper-step step="3">Name of step 3</v-stepper-step>
      </v-stepper-header>
      <v-stepper-items>
        <v-stepper-content step="1">
          <v-card
            class="mb-5"
            color="grey lighten-1"
            height="200px"
          >
            <div id="hot-preview">
              <hot-table :settings="hotSettings"></hot-table>
            </div>
          </v-card>
          <v-btn
            color="primary"
            @click="e1 = 2"
          >
            Continue
          </v-btn>
          <v-btn flat>Cancel</v-btn>
        </v-stepper-content>
        <v-stepper-content step="2">
          <v-card
            class="mb-5"
            color="grey lighten-1"
            height="200px"
          ></v-card>
          <v-btn
            color="primary"
            @click="e1 = 3"
          >
            Continue
          </v-btn>
          <v-btn flat>Cancel</v-btn>
        </v-stepper-content>
        <v-stepper-content step="3">
          <v-card
            class="mb-5"
            color="grey lighten-1"
            height="200px"
          ></v-card>
          <v-btn
            color="primary"
            @click="e1 = 1"
          >
            Continue
          </v-btn>
          <v-btn flat>Cancel</v-btn>
        </v-stepper-content>
      </v-stepper-items>
    </v-stepper>
  </v-app>
</div>

new Vue({
  el: '#app',
  data () {
    return {
      e1: 0,
      hotSettings: {
        data: Handsontable.helper.createEmptySpreadsheetData(1, 8),
        colHeaders: true,
        rowHeaders: true
      }
    }
  },
  components: {
    HotTable
  }
});

Answer 1

我认为问题是因为您在安装组件之前对其进行了初始化。
尝试在安装的挂钩中对其进行初始化：

import numpy as np
import matplotlib.pyplot as plt

v_x = np.random.randint(0, 80000, 30000)
v_y = v_x # the x, y cordinate of the dots.

f,axes = plt.subplots(5,5,figsize = (40,40))
for row in range(5):
    for col in range(5):
        print(row,col)

        axes[row,col].set_yticklabels([])
        axes[row,col].set_xticklabels([])

        if row > col:
            axes[row,col].axis('off')
        else:
            axes[row,col].set_xlim(0,len(v_x))
            axes[row,col].set_ylim(0,len(v_y))


            axes[row,col].scatter(v_x,v_y, c = '#000000', s=(72./300)**2, marker = 's', edgecolor= '')
f.savefig('{}'.format('test.ps'), facecolor='w', bbox_inches='tight', dpi = 300)

在Vuetify Stepper中时，Handsontable不会立即显示

1 个答案: