[Vuejs]-Interpolation in a Vue component that creates HTML

by

0👍

Your new component should look something like this:

<template>
  <label class="title">{{ caption }}</label>
  <span class="score float-right">Score: {{ onTime }}</span>
</template>

<script>
export default
{
  name: 'MyNewComponent',
  props:
  {
    caption:
    {
      type: String,
      default: ''
    },
    onTime:
    {
      type: [String, Number],
      default: 0
    }
  }
}
</script>

Then you can call your component in this way:

<my-new-component :caption="Big title" :on-time="score.ap_ontime" />

Leave a comment