typescript 如何将值显示为一位小数

w80xi6nr  于 2023-03-04  发布在  TypeScript
关注(0)|答案(1)|浏览(304)

我使用类星体框架,并有一个显示值的q滑块。我希望小数位数限制为1。

在版本js中

:formatter="value => value.toLocaleString(undefined, {minimumFractionDigits: 1, maximumFractionDigits: 1})"

:formatter="(value) => value.toFixed(1)"
 
<q-item-label class="u-text-user-selected-value">
   {{ eco }}{{ unitSymbol }}
 </q-item-label>

<q-item class="q-item__select q-item__slider">
            <q-slider
              :key="timestampUpdateEco"
              v-model="modelEco"
              @change="(value) => setValueEco(value)"
              :min="minBoundary"
              :max="maxBoundary"
              :step="1"
              label
              color="red-9"
            />
          </q-item>

甚至试图改变它被赋予的值。

英寸ts

private get eco(): number {
    return Number(this.uxOneThermalModuleStore.heatingEco.toFixed(1));
  }

  private async setValueComfort(value: number) {
      if (value < this.minBoundary + diff) {
        value = this.minBoundary + diff;
        this.modelComfort = value;
      }
      await this.uxOneThermalModuleStore.setHeatingComfort(value);
    }
  }

但我还是得到了62.9999999这样的值

eyh26e7m

eyh26e7m1#

在我使用codepen进行的测试中,它取决于选择的步长,因此您可以将步长设置为0.1

<div id="q-app">
  <div class="q-ma-lg">
    <q-slider
      v-model="modelEco"
      :min="0"
      :max="10"
      :step="0.1"
      label
      color="red-9"
    />
  </div>
</div>
const { ref } = Vue;

const app = Vue.createApp({
  setup () {
    const modelEco = ref(5.2)
  }
})

app.use(Quasar, { config: {} })
app.mount('#q-app')

相关问题