Верхний индекс результатов .toFixed () - PullRequest
Новая
       8

Верхний индекс результатов .toFixed ()

0 голосов
/ 19 декабря 2018

В моем шаблоне Vue.js у меня есть строка шаблона для расчета общей суммы.Я использовал метод .toFixed () для отображения десятичных дробей.Десятичные числа должны отображаться в верхнем индексе.

Как я могу надписать часть .toFixed (2) строки моего шаблона ниже? 

{{ Number.isInteger(calculation.total) ? (calculation.total + '.-') : 
calculation.total.toFixed(2) }}

Таким образом, общая сумма должна отображаться, например, как 180. 50 вместо 180.50.

ОБНОВЛЕНИЕ: Спасибо, что сообщили мне, что .sup () устарела.Как я могу получить верхний индекс в строке шаблона без устаревшего метода?Я перефразировал вопрос.

1 Ответ

0 голосов
/ 19 декабря 2018

Вы можете использовать повторно используемый компонент, который обрабатывает всю логику форматирования внутри отдельной области видимости. 

const Price = {
  template: '<span>{{ int }}.<sup>{{ fraction }}</sup></span>',
  props: {
    value: {
    type: Number,
      required: true,
    },
  },
  computed: {
    int() { return Math.floor(this.value); },
    fraction() {
      const i = this.int, v = this.value
      return v === i
        ? '-'
        : Math.round((Math.abs(v) - Math.abs(i)) * 1e2)
    },
  },
}


new Vue({
  el: "#app",
  components: {
    Price,
  },
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>

<div id="app">
  <Price :value="40.3253" />
</div>
...